react中動態添加style和className

1、動態添加style

<div style={{height: this.state.is_makeup===0 ? "100%" : "50%"}}</div>

添加多個樣式

<div style={{display: (index===this.state.currentIndex) ? "block" : "none", color:"red"}}>此標籤是否隱藏</div>

2、動態添加className

1)、如果標籤中本來沒有其他的classname

<div className={index===this.state.currentIndex?"active":null}>添加className</div>

2)、標籤本身有其他的className

<div className={["container tab", index===this.state.currentIndex?"active":null].join(' ')}>添加className</div>

ES6寫法
<div className={`container ${index===this.state.currentIndex?"active":null}`}>此標籤是否選中</div>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章