reactjs - React/Redux 组件没有正确渲染
问题描述
我是 Redux 的新手,我的问题是无法渲染组件并且没有任何错误消息显示,当我只渲染 Option1(变量)时,它正确显示而无需应用 redux,有人帮忙吗?谢谢你 !!!!任何人都可以通过一些编码示例解决我的问题吗?
行动
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')
);
解决方案
推荐阅读
- .htaccess - .htaccess 中的 301 重定向将旧文件路径/名称附加到新 url
- sql - SQL 重叠查询
- python - 如何使用 Pandas 计算两个数据帧之间的百分比差异?
- python - 使用 pandas 将数据添加到 Dataframe
- angular - angular primeng 冻结标题行,上面有标题行
- google-signin - Google 登录 - 检测是否已登录并提示用户
- javascript - Flot JS 将目标变成菱形
- c++ - 如何使用可变模板参数进行模板函数调用?
- jenkins - 完成后如何从 Jenkins 构建中获取构建详细信息的 json 响应
- react-native - Expo 不从 VS Code 调试器热重载