React / Redux组件未正确渲染

时间:2018-08-22 09:58:42

标签: reactjs redux

我是Redux的新手,我的问题是Component无法渲染,msg没有显示任何错误, 当我只渲染Option1(variable)时,它可以正确显示而不应用redux,有人帮忙吗?谢谢 !!!!谁能用一些编码示例thx解决我的问题!

操作

function clickRaidoButt(id) {
    return {
        type: 'CLICK_RADIO',
        payload: id
    }
}

减速器

function reducreForRadio(state = initialStateForRadio, action) {
    if (typeof state === 'undefined') {
        return 0
    }

    var id;

    switch(action.type) {
        case 'CLICK_RADIO': {
             return {
                 id: action.payload
             }
        }
        default: {
             return state
        }
    }
}

组件

var Option1 = React.createClass({


    render() {
        const { id } = this.props;    

        return ( 
            <label>
                <input  
                    onClick={() => this.props.clickRaidoButt('option1')}  
                    type="radio" 
                    id="option1" 
                    name="selOption" 
                />
            </label>
        );
    }
});

映射

function mapDispatchToPropsForRaidoButt (dispatch) {
    return { 
        clickRaidoButt : (id) => dispatch(clickRaidoButt(id))
    };
}

function mapStateToPropsForRaidoButt(state) {  
    return {  
        id: state.reducreForRadio.id
    }  
}  

连接

var rootReducer = Redux.combineReducers({
    reducreForAge,
    reducreForButtonGroup2,
    reducreForRadio
});

const radio1 = connect(mapStateToPropsForRaidoButt,mapDispatchToPropsForRaidoButt)(Option1);

ReactDOM.render(
    <Provider store={store}>
        <radio1/>
    </Provider>,
    document.getElementById('selOption1')
);

0 个答案:

没有答案