在样式对象reactjs

Question

我想动态传递背景颜色，并希望像这样设置组件

<Paper style={circleStyle} zDepth={1} circle={true}> V </Paper>

const circleStyle = {
  ....
  background: '#00AA90',
  .....
};

在这个例子中，我想动态地传递背景颜色如何做到这一点，我在circleStyle中也有其他样式？

PS：如果我在这种情况下使用ClassName也不能使用动态值，那么有什么想法吗？

Answer 1

像这样写：

style={{...circleStyle, backgroundColor: 'red'}}

或

style={ Object.assign({}, circleStyle, {backgroundColor: 'red'}) }

现在样式将获得一个包含circleStyle值以及backgroundColor的新对象。

检查此代码段：

＆＃13;

＆＃13;

let obj = {a: 1, b: 2};

let newObj = {...obj};      //equivalent to Object.assign({}, obj)

console.log('newObj = ', newObj);

＆＃13;

＆＃13;

＆＃13;

查看此答案，了解有关Spread Operator (...)的详细信息：

What do these three dots in React do?