2017-10-10 3 views
0

私のコードの2つの領域にあるチェックボックスに問題があります。私のレデューサーの最初のものは、チェックボックスの現在の状態が"true"または"false"であるかどうかを確認したいが、 ifのエラーRedboxでチェックボックスを使用する

const initialState = { 
    viewCheckbox: false 
} 
export default (state = initialState, action) => { 
    switch (action.type){ 
     case 'VIEW_CHECKBOX': 
      return { 
       ...state 
       if (viewCheckbox == false) { 
        viewCheckbox: true 
       } else { 
        viewCheckbox: false 
       } 
      } 
     default: 
      return: state 
    } 
} 

私の第二の問題は、mapDispatchToPropsであり、私は複数のチェックボックスを作成するには、テーブルを使用していると私はIDによってそれらの一つ一つを区別できるようにしたい、と私はこのようにそれを行う際に、テーブルのすべてのチェックボックスをチェックします。

const mapDispatchToProps = (dispatch) => ({ 
    handleViewCheckbox: id => ev => { 
     dispatch(viewCheckboxSubmit(id, ev.target.checked)) 
    } 
}) 

そして私は、私はこのようにそれを行うのチェックボックスを作成するとき:

<FormControlLabel 
    control={ 
     <Checkbox 
      checked={checkedView} 
      onChange={handleViewCheckbox(n.id,checkedView)} 
     /> 
    } 
    label='See' 
/> 

答えて

1

あなたはそのようなオブジェクトの内部であれば行うことができません。スプレッド演算子は、使用したい変数と一致するソロ変数を追加するか、キーを直接追加することができます。あなたはそれがチェックされているかどうかを管理するために、状態の同じビットを使用しているので、

case 'VIEW_CHECKBOX': 
    return { 
     ...state, 
     viewCheckbox: !viewCheckbox 
    } 

彼らはすべてのオンとオフを切り替えるにはなるだろう。このような何かを試してみてください。このようにしたい場合は、それぞれのオブジェクトがチェックインされているかどうかを保存しておき、それを更新し続けることができます。あなたはmapStateToPropsでそのオブジェクトを引き出してisChecked

それを呼ばれると仮定し

{ 
    checkboxid1: false, 
    checkboxid2: false, 
    checkboxid3: true // checked 
} 

、あなたのチェックボックスコンポーネントのchecked小道具は次のようになります。..

checked={this.props.isChecked[n.id]} 

関連する問題