В порядке ли этот редуктор? - PullRequest
Новая
       13

В порядке ли этот редуктор?

1 голос
/ 08 апреля 2019

В порядке ли этот редуктор: 

function someReducer(state = initialState, action) {
   if (action.type === SOME_ACTION) {
      const newState = Object.assign( {}, state );
      // ...
      // doing whatever I want with newState 
      // ...
      return newState;
   }   
   return state;
}

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

p.s Просто пытаюсь понять Redux и неизменность

Ответы [ 4 ]

5 голосов
/ 08 апреля 2019 

export default function (state = initialState, action) {

  const actions = {
    SOME_ACTION: () => {
      return {
        ...state
      }
    },
    ANOTHER_ACTION: () => {
      return {
        ...state
        error: action.error
      }
    }
    DEFAULT: () => state;
  }
  
  return actions[action.type] ? actions[action.type]() : actions.DEFAULT(); 
}

Я предпочитаю делать это вместо этого.Я не большой поклонник заявлений о смене.

3 голосов
/ 08 апреля 2019

Стандартный подход заключается в использовании switch/case с синтаксисом расширения (...) в вашем редукторе. 

export default function (state = initialState, action) {
  switch (action.type) {
    case constants.SOME_ACTION:
      return {
        ...state,
        newProperty: action.newProperty
      };

    case constants.ERROR_ACTION:
      return {
        ...state,
        error: action.error
      };

    case constants.MORE_DEEP_ACTION:
      return {
        ...state,
        users: {
          ...state.users,
          user1: action.users.user1
        }
      };

    default:
      return {
        ...state
      }
  }
}

Затем можно использовать синтаксис распространения ES6 для возврата вашего старого состояния с любыми новыми свойствамиВы хотите изменить / добавить его.

Подробнее об этом подходе вы можете прочитать здесь ... https://redux.js.org/recipes/using-object-spread-operator

0 голосов
/ 08 апреля 2019

Я нашел то, что мне действительно нравится: 

 import createReducer from 'redux-starter-kit';
 const someReducer = createReducer( initialState, {
    SOME_ACTION: (state) => { /* doing whatever I want with this local State */ },
    SOME_ANOTHER_ACTION: (state) => { /* doing whatever I want with local State */ },
    THIRD_ACTION: (state, action) => { ... }, 
 });
0 голосов
/ 08 апреля 2019

Если в вашем состоянии есть вложенные объекты или массивы, Object.assign или ... скопирует ссылки на вашу более старую переменную состояния, и это может вызвать некоторые проблемы. По этой причине некоторые разработчики используют неизменяемые библиотеки, так как в большинстве случаев состояние имеет вложенный массив или объекты. 

function someReducer(state = initialState, action) {
   if (action.type === SOME_ACTION) {
       const newState = Object.assign( {}, state );
       // newState can still have references to your older state values if they are array or orobjects

      return newState;
   }   
   return state;
}
...