React Redux: как обмениваться данными между редукторами?

Вы используете два разных состояния (или, скажем, initialState) для каждого редуктора. Следовательно, обновление в одном объекте не отражается в другом.

Вам нужно использовать общий initialState для редуктора, и ваша проблема будет решена.

Вы можете сохранить initialState в другом файле, и вы можете импортировать его в оба редуктора.

Рассмотрим ниже пример кода:

1.InitialState.js

export default initialState = {
  todoList: [
    { text: "fake todo" },
    { text: "fake todo" },
    { text: "fake todo" }
  ],
  cachedInput: ""
};

2.Теперь в CachDataOfTodoInput.js

import initialState from "InitialState";

export function cachInput(state = initialState, action)

3. То же в SubmitDataToTodo.js

import initialState from "InitialState";
export function submitNewTodo(state = initialState, action)

Следовательно, intialState совместно используется вашими редукторами, и вы сможете получить доступ к данным в каждом редукторе.

onChange event that triggers an action and sends event.target.value to a reducer and stores each character the users types to a property of the store object

На практике это неправильный способ использования redux->action->reducers->store, учитывая, что вы отправляете форму для отправки тех же данных редукторам.

Это приведет к ненужному рендерингу компонента, связанного с redux#connect, если вы неправильно обработали shouldComponentUpdate /componetWillRecieve/getDerivedStateFromProps

Вместо этого сохраните каждый набранный вами символ / строку внутри компонента state, и как только пользователь отправит его, dispatch в action для передачи строки / символов в reducer's.

Если вы хотите загрузить свое приложение с начальным состоянием, которое содержит ранее кэшированные данные, и если вы используете рендеринг на стороне клиента, вы можете вставить кэшированные данные в хранилище redux в локальное хранилище и использовать это в качестве начального состояния.

Если вы просто хотите, чтобы данные были импортированы в другой редуктор после отправки формы, вы можете использовать redux-thunk. Он позволяет загружать текущее состояние в действие отправки и передавать значения перехвата в другой редуктор и сохранять их.

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

Ask yourself whether you've structured your reducers correctly. If a and b are not independent of one another, why are they separate reducers?

Что ж, если мы говорим о правильном структурировании редуктора, cachedInput и todoList должны жить в одном редукторе. Нет необходимости создавать другой редуктор. Также я предполагаю, что вам нужно получить все входное значение сразу (когда пользователь нажимает кнопку отправки) и отправить его в хранилище.

Если вы все же хотите создать отдельные редукторы, вы можете следовать подходу, приведенному ниже:

Ответ на Как получить доступ или поделиться данными, уже хранящимися в хранилище, внутри редукторов?

Не используйте combReducers.

Пример

замените этот код

export const a = combineReducers({
  cachInput,
  newTodo
});

с участием

export default (state = {}, action) => {
  return {
    cachInput: cachInput(state.app, action, state),
    newTodo: newTodo(state.posts, action, state),
  };
};

редуктор был бы похож

const reducer = (state = initialState, action, root) => {....}

и вы можете получить доступ к предыдущему состоянию из root