2017-03-02 4 views
-1

私はreduxでチェックボックスの状態を変更しようとしています。最後の部分を除いてすべてが正しく設定されています。私は、ちょうど他にそれを入れた場合、私はこれが私のコード1つのオブジェクトの値をt​​rueまたはfalseに変更します。

export function isChecked(isCheck) { 

if(isCheck == false){ 
    return{ 
     type: "IS_TRUE", 
     isCheck 
    } 
} else if (isCheck == true){ 
    return{ 
     type: "IS_FALSE", 
     isCheck 
    } 
    } 
} 

ある

Uncaught TypeError: Cannot read property 'payload' of undefined 

「偽」または「真」を送信しようと呼び出すためにどのようなアクションで決めるが、私はこのエラーを取得します細かい動作しますが、それはあなたがここに、間違った方法でReduxのを使用している

答えて

2

を変更しないの周りに二回目は、チェックボックスの例です:

// action 

export const SET_CHECKBOX_VALUE = 'SET_CHECKBOX_VALUE '; 
export function setChecked(checked) { 
return { 
    type: SET_CHECKBOX_VALUE, 
    checked 
} 
} 

// filter/Reducer 

import { SET_CHECKBOX_VALUE } from '..your action file here'; 

const initialCheckboxState = { isChecked: false }; 

export default function checkBoxFilter(state, action) { 
    switch (action.type) { 
    case SET_CHECKBOX_VALUE : 
     return { checked: action.checked} 
    default: 
     return initialCheckboxState; 
    } 
} 

// component 
import React, { Component } from 'react'; 
import { bindActionCreators } from 'redux'; 
import { connect } from 'react-redux'; 

import * as checkBoxActions from '..your action file here'; 

class MyComponent extends Component { 

    static propTypes = { 
    isChecked: React.PropTypes.bool.isRequired, 
    setChecked: React.PropTypes.func.isRequired 
    }; 

    render() { 
    return (
     <div onClick={() => { this.props.setChecked(!this.props.isChecked) }> 
     {this.props.isChecked} 
     </div> 
    ); 
    } 
} 

function mapStateToProps(state) { 
    return { 
    isChecked: state.checkBoxFilter.checked 
    }; 
} 

function mapDispatchToProps(dispatch) { 
    return bindActionCreators(checkBoxActions, dispatch); 
} 

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent); 
関連する問題