如何在HTML中设计React组件

我正在通过数组进行映射，我想根据该元素是否存储在用户配置文件中来设置背景颜色，但我在设置背景颜色时遇到了问题，而我会得到这个错误。 '不变违规：style prop需要从样式属性到值的映射，而不是字符串。例如，使用JSX时，style = {{marginRight：spacing +'em'}}。这DOM节点被AddingHabit“如何在HTML中设计React组件

呈现

 <div>{this.renderHabits().map((habitObject)=>{ 
       return (<div className="addingHabitPic habitpics" key={habitObject.imageLink} id="picplusdiv"> <img src={habitObject.imageLink} height="288" width="197"/> <div style="background-color:black" className="testdiv">Where is text?</div></div>) 
      })} 
     </div>

黑将后一个变量来代替，但是这仅仅是得到它的工作。我试过style = {{background-color：black}}，因为错误提示但没有运气。这是使用与流星的反应。

来源

2016-03-28 ChrisWilson

你几乎可以得到它，只是在做这个映射时你必须使用稍微不同的语法。而不是破折号的样式，你必须使用camelCase（同样，你写下了black，但这是一个未定义的变量，所以你需要一个字符串'black'）。以下将工作：

{{ backgroundColor: 'black' }}

你可以应用相同的逻辑几乎所有其他的CSS样式。

来源

2016-03-28 02:16:26 ZekeDroid

谢谢你的兄弟你摇滚。我会在8分钟内将您标记为正确答案。 – ChrisWilson

Read the docs!

这种情况在React文档中有介绍。

var divStyle = { 
    backgroundColor: 'black', 
};

，并在渲染调用做<div style = {divStyle}>：在一个对象，你必须通 - 你不能传递一个字符串到styles道具。

来源

2016-03-28 02:16:55

谢谢你，将来会做。 – ChrisWilson

如何在HTML中设计React组件

回答

相关问题