Bootstrap .well - 改變顏色與反應道具

Question

我正在使用引導& reactjs。 我的頁面上有.well-component。用戶應該能夠改變它的顏色。顏色存儲在{this.props.color}中。 我試圖改變這樣的：

<div className="well lead" style={{backgroundColor:'{this.props.color}'}} style={{marginTop:'20px'}} >

但它不工作&我沒有任何想法，爲什麼

Answer 1

在你的代碼中使用'this.props.color'這是一個普通的字符串。 應改爲：

style={{backgroundColor: this.props.color}} 

順便說一下，你最好把同一對象中的所有樣式屬性：

<div className="well lead" style={{backgroundColor: this.props.color, marginTop:'20px'}} >