1. 程式人生 > >解決react不能往setState中傳key作為參數的辦法

解決react不能往setState中傳key作為參數的辦法

功能 ont key div 解決 思考 函數 tro 就會

有時候我們需要每次單獨設置眾多state中的一個,但是,都是進行相同的操作,這時候如果每個值都要單獨寫一個相同的函數的話,違背了don‘t repeat yourself的原則,並給日後的維護埋下了極大的隱患。 這時我們就會想向上抽取,把每次不同的key傳遞給這個函數,就像下面這樣: this.state = {   visibleA: false,   visibleB: false,   visibleC: false, } <button onClick = {this.handleClick.bind( this, "visibleA" )}> handleClick( key
) {
  this.setState({     key : fooArr,   }); } 但是因為key不能作為參數傳遞,然後會無效;因為我們傳遞給key的實際就是字符串 =================================================我是華麗的分割線========================================================== 然後經過思考,發現可以嘗試使用數組的形式,方法如下
this.state = {   //設置狀態   visibleAll: [false, false,false], }
<button onClick = {this.handleClick.bind( this, 0 )}>    //這時候可以往裏面傳入數組下標,然後就實現了功能的復用 handleClick( i ) {   let fooArr = this.state.visibleAll;   
  fooArr[ i ] = !fooArr[ i ];       this.setState({     visibleAll: fooArr,   }); } 總結:然後不能傳入key值,但是可以通過把需要操作的值放入一個數組中,這樣我們就可以對整個數組中的一個值或者多個值,實現一個函數對其進行操作;實現復用功能。

解決react不能往setState中傳key作為參數的辦法