在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ react動態(tài)改變樣式

react動態(tài)改變樣式

實現(xiàn)一個點擊按鈕變色的簡單需求(react + mobx)

render() {
        return (
          <div className="begin">
          <h3>請選擇本局配置</h3> 
            <div className="options-box">  
                  {
                      this.store.config.map((val, index) => {
                          return (
                    <span onClick={this.select.bind(this, index)} key={index}>
                    <i style={{backgroundColor: val.select ? '#365dea' : '#FFF'}}></i>
                    {val.title}</span>
                            )
                      })
                     }
            </div>
          </div>
        );
      }

select是一個action

 @action select = (index) => {
    this.config[index].select = !this.config[index].select
    console.log(this.config[index].select);
  }

點擊按鈕發(fā)現(xiàn)this.config[index].select是變化的,但是按鈕顏色沒變,求大神告知怎么解決?

回答
編輯回答
痞性

你在action輸出這個config值變化了,但你的store值有改變么?你在render下輸出config看你的值變了沒有呢

2018年6月23日 04:42
編輯回答
苦妄

你的style是根據(jù)val.select來變化的,關(guān)this.config[index].select什么事

2018年5月6日 01:02
編輯回答
拮據(jù)

你的值變了,但是render肯本沒有重新渲染呀,你只是單純的改變了this.config[index].select的值,
你加一個<p>{val.select}</p>看一下值有沒有變化,
肯定要用setState來改變state才能讓render重新渲染DOM吧。

2017年12月23日 23:35