gpt4 book ai didi

javascript - react /归零 : mapStateToProps not actually mapping state to props

转载 作者:数据小太阳 更新时间:2023-10-29 05:29:18 26 4
gpt4 key购买 nike

我在项目中使用 React 和 Redux,但在实现启用/禁用按钮的功能时遇到问题。我已经能够:

  • 触发方法
  • 让该方法触发 Action 创建器
  • 发送一个 Action
  • 在 reducer 中捕获该操作并创建一个新的更新状态
  • 在 Redux DevTools 中查看更新状态

但是,启用/禁用功能仍然不起作用,因为似乎 mapStateToPropsconnect 实际上并未将状态映射到 Prop 。我正在跟踪 canSubmit,它在状态内发生变化,但在 props 中是 undefined。我缺少什么才能成功地将状态映射到 Prop ?

相关代码:

用户窗体 View

const mapStateToProps = (state) => ({
routerState: state.router,
canSubmit: state.canSubmit
});
const mapDispatchToProps = (dispatch) => ({
actions: bindActionCreators(ActionCreators, dispatch)
});

class UserFormView extends React.Component {

...

}

export default connect(mapStateToProps, mapDispatchToProps)(UserFormView);

Action :

export function enableSubmit(payload) {
return {
type: ENABLE_SUBMIT,
payload: payload
};
}

export function disableSubmit(payload) {
return {
type: DISABLE_SUBMIT,
payload: payload
};
}

Reducer(使用 createReducer 辅助函数):

const initialState = {
canSubmit: false
};

export default createReducer(initialState, {

[ENABLE_SUBMIT]: (state) => {
console.log('enabling');
return Object.assign({}, state, {
canSubmit: true
});
},

[DISABLE_SUBMIT]: (state) => {
console.log('disabling');
return Object.assign({}, state, {
canSubmit: false
});
}

});

最佳答案

似乎您没有使用键 canSubmit 创建 reducer。这取决于您的商店配置,更具体地说,取决于您如何从 reduce 文件中导入默认导出。这里要提到的另一件事是,您可能会有名为 canSubmit 和键 canSubmit 的 reducer,因此您需要在 之类的代码中引用它state.canSubmit.canSubmit — 您从 reducer 上的操作处理程序返回对象,而不是简单的 truefalse bool 值。

关于javascript - react /归零 : mapStateToProps not actually mapping state to props,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33930098/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com