Как редукторы обновляют магазин

Question

Я новичок в Redux и нахожу некоторые проблемы с пониманием концепции редукторов. Я вижу много примеров, показывающих, что оно принимает текущее состояние и возвращает обновленное состояние. Мой вопрос заключается в том, как он обновляет Store, возвращая новое состояние (яМне трудно понять механизм), может кто-нибудь объяснить, пожалуйста.

Answer 1

Redux store - не что иное, как объект, содержащий все состояния приложения. Редуктор - единственный способ обновить магазин.

Редуктор - это чистая функция, которая принимает старое состояние и возвращает новое состояние. В редукторе нам нужно просто указать старое состояние, которое хранится в данный момент, а затем новое состояние, которое мы собираемся изменить. Вы можете обратиться к this для подробного объяснения функции снижения.

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

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

https://www.jamasoftware.com/blog/lets-write-redux/

Answer 2

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

let Action={type:'SET_VISIBILITY_FILTER',text: 'test pay load'}

//Invoking Reducer
let store=todoApp({},Action)

//Reducer
function todoApp(state = initialState, action) {
  switch (action.type) {
    case SET_VISIBILITY_FILTER:
      return Object.assign({}, state, {
        message: action.text
      })
    default:
      return state
  }
}

Answer 3

Это изображение, которое я нашел очень полезным, когда я изучал ту же концепцию.

---

Отправка

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

 functionName:()=>(dispatch)({type:'some-thing-to-match',payload})

---

Редукторы Это обрабатывает изменение состояния.

Магазин Комбинация всех редукторов (корневой редуктор).

const store = combineReducers({
Reducer1:r1,
Reducer2:r2,
Reducer3:r3
})

Например, возьмите диспетчерскую функцию в TodoList, которая совпадает с r1 и меняет ее состояние. Затем, подключившись из 'response-redux', мы свяжем состояние редукторов с TodoList.

var mapStateToProps = state=>{
 return:{
 r1:r1
}
}

, тогда реакция будет реагировать на любыеизменить в состоянии.Если состояние r1 изменяется, он обновляет этот компонент.

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

Как мы видим на изображении.Диспетчеризация изменит состояние магазина. Затем вы можете импортировать (подключить) этот редуктор, чтобы увидеть изменения в вашем компоненте (здесь TodoItem - это тот компонент)