2017-08-23 17 views
2

サンプルアプリケーションを開発中です。そこで、テーブルのコンポーネントを使用して行、col値を空の配列にプッシュしました。行、col値が空の配列に存在する場合は、チェックマークを表示する必要があります。また、ユーザーがチェックマークを付けるか(または)チェックボックスをもう一度選択するとチェックを外す必要があります。誰も私にこの問題を解決する方法を提案できますか?あらゆる最善の解決策が評価されます。 反応ネイティブの表の各チェックボックスのチェック/チェックを外す方法

_showData = (data,i,j) => { 

    this.setState({iValue:i,jValue:j},()=>{ 
    //this.fetchData() 
     this.state.tableCellData.push({"i":i,"j":j}) 
     this.setState({isSelected:true,tableCellData:this.state.tableCellData},()=>{/*alert("array:"+JSON.stringify(this.state.tableCellData))*/}) 

     if(this.state.isSelected == true){ 
      this.setState({isSelected:false}) 
     }else{ 
      this.setState({isSelected:true}) 
     } 

    this.state.tableCellData.map((item, index) => { 
    if(item.i == i && item.j == j){ 
     this.state.tableCellData.splice(index,0) 
     this.setState({isSelected:false}) 
     alert("splice:"+JSON.stringify(this.state.tableCellData)) 
    } 
    }) 
    this.fetchData() 

    }) 

} 

は私が状態を変異避けるために、各セルのデータ

please check the above image that shows table view

答えて

0

試しにクリック可能なアクションを表示するには、この_showdata機能を使用していました。これは、あなたがそれを変異することなく、状態に項目を追加する方法です。私は(状態突然変異だろう)tableCellDataアレイに直接新しいデータをプッシュしていなかったが、代わりに私が作成した

this.setState({ 
    isSelected:true, 
    tableCellData: [ 
     ...this.state.tableCellData, 
     {i, j} 
    ] 
}); 

お知らせ新しいtableCellData配列その後、新しい配列を使用して状態を更新しました。これには正当な理由があります。

状態を変更した場合(投稿したコードのように)、oldState.tableCellData === newState.tableCellData(両方ともメモリ内の同じオブジェクトを指しています)。

関連する問題