Почему не могу оперировать со стандартными пропсами из store'a?

Question

[Nikita Shchypylov]

Добавил такой стейт в комбайн :

export default combineReducers({
  userIdea: inputIdeaReducer, //работает
  ideas: renderIdeas, //работает
  isInputActive: false //не работает
});

в компоненте :

function mapStateToProps(state) {
  return {
    userIdea: state.userIdea,
    ideas: state.ideas,
    isInputActive: state.isInputActive
  };
}
export default connect(mapStateToProps, mapDispatchToProps)(Dashboard);

и использование в том же компоненте :

<input
              type="text"
              onChange={this.inputChangeHandle}
              placeholder="Type some text"
              // value={this.props.userIdea}
            />

  inputChangeHandle = e => {
    let value = e.target.value;
    console.log(this.props.isInputActive);
  };

Выдаёт undefined. Почему?
Хочу менять стейт на тру/фолс в записимости от текста в инпуте

Answer 1

[Антон Спирин]

combineReducers принимает на вход объект с функциями вида:
(state: S, action: A) => S
а вы передаете boolean.

Создайте для isInputActive функцию reducer, что-то вроде

const isInputActiveReducer = (state = false, action) => {
  const { payload, type } = action;

  switch(type) {
    case TOGGLE_INPUT:
      return payload;
  default:
      return state;
  }
}

Но вообще передавать состояние input в store плохая идея. Для этого с лихвой хватит state компонента.

Comments

[Nikita Shchypylov]

Спасибо, а это практикуется - пользоваться стейтом компонента, если есть редакс?

[Антон Спирин]

Nikita Shchypylov, конечно. Еще как практикуется. И состояние компонента(открыт, скрыт, активен) это как раз тот кейс, когда следует использовать state компонента. Так же часто используется state родителя, с передачей состояния и колбека для его изменения дочернему компоненту(пагинация, сортировка, состояние форм, фильтрация). В самом store хорошо хранить сущности полученные с сервера и состояния связанные с ними isLoading, isError, всякие глобальные настройки, права, данные о пользователе и всякую прочую статику пришедшую с сервера. Тут в двух словах не рассказать, конечно. Необходима практика. Еще хорошо разбирать примеры хорошего кода.