Могу ли я использовать createStore() из избыточности внутри компонента?

Вопрос: Можно ли использовать createStore() из редукса в компоненте? Если да, то как это сделать правильно?

Я пытаюсь понять реакцию и редукцию, преобразуя этот пример секундомера в подход, основанный на компонентах.

Оригинальный подход заключается в следующем:

let container = Redux.createStore((model = { running: false, time: 0 }, action) => {
  const updates = {
    'START': (model) => Object.assign(model, {running: true}),
    'STOP': (model) => Object.assign(model, {running: false}),
    'TICK': (model) => Object.assign(model, {time: model.time + (model.running ? 1 : 0)})
  };
  return (updates[action.type] || (() => model))(model);
});

А также

const render = () => {
  ReactDOM.render(view(container.getState()),
    document.getElementById('root')
  );
};

Что я получаю до сих пор, так это это, который не показывает счетчик div.

Обратите внимание, что я пытаюсь понять причины, лежащие в основе реакции и редукса, таким образом избегая намеренного использования react-redux.

Мой проект использует create-react-app для создания скелета в первую очередь.

XoXo 09.04.2019 19:37
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
1
86
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Технически это возможно, но так делать не следует.

В React вы хотите, чтобы вывод метода render зависел только от свойств и состояния компонента. Итак, что вы хотите сделать, так это определить компонент, который ожидает, что что-то вне него предоставит реквизиты, а затем сделать Redux этим провайдером. Подробнее об этом можно прочитать здесь. В вашем примере была еще одна проблема: Redux хочет, чтобы редуктор (метод, который вы передаете createStore), нет мутировал предыдущее состояние. Object.assign(state, ...) мутирует объект, поэтому его нужно заменить на Object.assign({}, state, ...). Подробнее об этом здесь.

У меня есть рабочий фрагмент для вас, но я настоятельно рекомендую следовать официальным руководствам :)

Другие вопросы по теме