Как получить последнее значение для состояния из магазина с избыточностью?

Question

Я довольно новичок в Redux, я использую пакет react-redux и пытаюсь реализовать простую функцию (хотя я знаю, что это может быть обработано через локальное состояние), где все, что вы вводите во ввод, должно отображаться нижемежду тегами <p></p>.

Ниже приведен код:

Я немного скептически отношусь к строке 62,способ доступа к последнему состоянию для печати, это правильный путь?

Answer 1

Хорошее начало, кстати.Я думаю, что вы немного усложнили государственную часть.Я изменил его для вас, а также удалил ключевое слово bind, которое, как мне кажется, не требуется, если вы используете последнюю спецификацию JS lang.

Я использовал Object.assign просто для предотвращения мутации объекта состояния.Обычно этого можно избежать, используя ImmutableJS (пожалуйста, прочитайте документацию)

// Reducer.
const updateReducer = (state = {text:''}, action) => {
  switch (action.type) {
    case UPDATE_TEXT:
      return Object.assign({}, state, { text: action.text });
    default:
      return state;
  }
};

const mapStateToProps = state => {
  return {
    text: state.text
  };
};

И метод визуализации:

 render() {
    return (
      <div>
        <input type="text" onChange={(...arg) => this.changeText(...arg)} />
        <p>{this.props.text}</p>
      </div>
    );
  }

Что не так с вашим исходным кодом?

Вы сохраняли весь текст в массиве для каждого нажатия клавиши вместе с обновленным и растущим текстом.При рендеринге просто отобразите последнюю (созданные ненужные копии в массиве, который никогда не используется) и пропустите другие значения массива.Вместо этого просто замените старое значение текущим входящим значением.

Ваш код Forked здесь

Happy Coding!