如何将默认样式设置为React Component

时间:2015-04-20 06:24:37

标签: javascript css reactjs

React组件非常棒,因为它可以让我们定义自己的标签,这些标签比原始标签更强大。

目前我只使用React组件来定义HTML结构,并设置每个标签的className以让样式表修改其外观。有没有办法在不使用内联CSS的情况下为组件提供默认样式?

我的一个想法是添加一个与一个组件关联的CSS文件,或者直接在jsx文件中为每个组件添加标签,然后编译CSS或jsx以将所有CSS放在一个文件中并将其部分添加。

1 个答案:

答案 0 :(得分:2)

在React中用inline style方法很容易表达:

var compStyle = {
  color: 'white',
  backgroundImage: 'url(' + imgUrl + ')',
  margin: 5
};

React.render(<div style={compStyle}>Component</div>, mountNode);