setState работает, но состояние приставки не обновляется при запуске onClick - PullRequest
Новая
       13

setState работает, но состояние приставки не обновляется при запуске onClick

0 голосов
/ 23 марта 2019

Привет, поэтому я пытался обновить свое состояние редукса с помощью setState, и по какой-то причине он будет сохранять только исходное состояние, а когда у меня срабатывает onClick, выключается setState, он только обновляет это локальное состояние и не обновляетизбыточное состояние, и оно просто остается в исходном состоянии. 

`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;
  }
};`

Ответы [ 2 ]

0 голосов
/ 24 марта 2019

Ваш редуктор должен быть 

export default (state = "", action) => {
  switch (action.type) {
    case "MENU_LAYOUT":
      return Object.assign({}, state, {
        displayMenu: action.payload
      })
    default:
      return state;
  }
};`
0 голосов
/ 23 марта 2019

Проблема в событиях вашего жизненного цикла.Похоже, вы пытаетесь выполнить свой поток с помощью 

componentDidMount()

Природа этой функции заключается в том, что она будет выполняться сразу после монтирования вашего компонента и никогда больше.Как и сейчас, настроенное вами событие onClick ничего не изменит для обновления вашего состояния избыточности.

Вам необходимо установить дополнительный обработчик события onChange, который будет вызывать вашего создателя действия menuLayout.

...