Обновление в Redux — создание нового состояния без обновления существующего состояния

#redux #state

#redux #состояние

Вопрос:

Задача состоит в том, чтобы создать функцию-редуктор для обработки нескольких действий аутентификации. Используйте оператор переключения JavaScript в редукторе для реагирования на различные события действия. Это стандартный шаблон при написании редукторов Redux. Оператор switch должен переключать действие.введите и верните соответствующее состояние аутентификации.

Есть два подхода, которые кажутся мне одинаковыми. На самом деле, я чувствую, что метод 2 лучше, чем метод 1, поскольку он фактически обновляет состояние. Однако freecodecamp, похоже, считает иначе. Может кто-нибудь сказать мне, в чем разница между 2.

Метод 1 — Создание новых объектов

 const defaultState = {
  authenticated: false
};

const authReducer = (state = defaultState, action) => {
  // change code below this line
  switch (action.type) {
    case "LOGIN":
      return {
        authenticated: true
      };

    case "LOGOUT":
      return {
        authenticated: false
      };

    default:
      return defaultState;
  }
  // change code above this line
};

const store = Redux.createStore(authReducer);

const loginUser = () => {
  return {
    type: "LOGIN"
  };
};

const logoutUser = () => {
  return {
    type: "LOGOUT"
  };
};
  

Способ 2: обновить существующий объект

 const defaultState = {
  authenticated: false
};

const authReducer = (state = defaultState, action) => {
  // Change code below this line
  switch(action){
    case 'loginUser':
    state.authenticated = true;
    return state;
    case 'logoutUser':
    state.authenticated = false;
    return state;
    default:
    return state;
  }

  
  // Change code above this line
};

const store = Redux.createStore(authReducer);

const loginUser = () => {
  return {
    type: 'LOGIN'
  }
};

const logoutUser = () => {
  return {
    type: 'LOGOUT'
  }
};
  

Сообщение об ошибке, которое я получаю в методе 2, выглядит следующим образом

Журнал ошибок

Комментарии:

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

2. Спасибо, но должны ли состояния быть неизменяемыми в Redux. само по себе это не накладывает никаких ограничений

3. Да, в react и redux все состояния неизменяемы . После отправки действия и возврата нового состояния выполняются все useSelector mapStateToProps методы or, когда они возвращают объект, отличный от последнего запуска, react-redux повторно отобразит компонент.