ReactJS：这是保留字

Question

我试图通过style道具从父组件传递样式数据到Child组件，但是我收到以下错误：

这是保留字

以下是与我的问题相关的相关代码：

儿童：

render {

    return (<table>
    <tr style={{backgroundColor: {this.props.color}}}> ...some text here...</tr>
    </table>)
}

家长：

constructor(props){
    super(props)
    this.state = {
       color: "red"  
    }
}

render() {
    return <Child color={this.state.color} />
}

我错过了什么？

Answer 1

看起来像Child组件的render()方法中的一个小语法错误。

删除{周围的}和this.props.color将解决此问题：

<tr style={{backgroundColor: this.props.color}}> ...some text here...</tr>