SetState起作用，但是当OnClick发射时，REDUX状态不会更新

Question

嗨，所以我试图用setState更新我的redux状态，由于某种原因，它只会保留原始状态，当我在setState上开火时，它只会更新该本地状态状态，它不会更新redux状态，它只是保持原始状态。

`class SubMenu extends Component {
  state={
    displayMenu: ''
  }
componentDidMount() {
  this.props.menuLayout(this.state.displayMenu)
}
  render() {
    return (
      <div className={`${display}`}>
        Sub menu
         <ul>
          <li onClick={() => {
            this.setState({
              displayMenu: 'd-none'
            })
          }}>
            Link1
          </li>
        </ul>
      </div>
    )
  }
}`
`export default connect(mapStateToProps, { menuLayout})(SubMenu);`

这是我的动作创造者

`export const menuLayout = layout => {
    return {
        type: MENU_LAYOUT,
        payload: layout
    }
}`

这是我的还原

`export default (state = "", action) => {
  switch (action.type) {
    case "MENU_LAYOUT":
      return action.payload
    default:
      return state;
  }
};`

Answer 1

问题是您的生命周期事件。看来您正在尝试用

执行您的流程

componentDidMount()

此功能的性质是它只会在组件安装后立即执行而又不会再执行。因此，正如现在一样，您已经设置的OnClick事件不会做任何事情来更新您的Redux状态。

您需要设置一个额外的Onchange事件处理程序，该处理程序将致电您的Menulayout Action Creator。

Answer 2

您的还原器应为

export default (state = "", action) => {
  switch (action.type) {
    case "MENU_LAYOUT":
      return Object.assign({}, state, {
        displayMenu: action.payload
      })
    default:
      return state;
  }
};`