почему состояние, возвращаемое из редуктора, помещается в объект - PullRequest
Новая
       10

почему состояние, возвращаемое из редуктора, помещается в объект

0 голосов
/ 18 октября 2018

Я использую функцию подключения из "response-redux" для отображения состояния и действий в качестве реквизита в моем компоненте.Используются комбинированные редукторы, как показано ниже: 

import { combineReducers } from "redux";
import userDetails from "./userDetails";    
export default combineReducers({
  userDetails
});

При включении отладчика в функцию mapStateToProps enter image description here объект состояния не находится на верхнем уровне, а переносится под ключом: userDetails, который является именемодного из редукторов: 

 import { FETCH_USER_DETAILS } from "../actions/type";

const reducer = (state = null, action) => {
  switch (action.type) {
    case FETCH_USER_DETAILS:
      return {
        ...{
          ...action.payload,
          isLoading: false
        }
      };
    default:
      return state;
  }
};

export default reducer;

Теперь, так как объект состояния недоступен на верхнем уровне, я должен добавить больше логики в mapStateToProps, как показано ниже: 

const mapStateToProps = state => {
  if (state.userDetails)
    return {
      title: state.userDetails.title,
      author: state.userDetails.author,
      rating: state.userDetails.rating,
      reviews: state.userDetails.reviews,
      isLoading: state.userDetails.isLoading
    };
  else return {};
};

Есть ли способэто состояние, возвращаемое редуктором в хранилище, не переносится ни в один объект {ключ объекта, такой же, как имя редуктора}, так что я могу упростить функцию mapStateToProps, как показано ниже: 

const mapStateToProps = ({ title, author, reviews, rating, isLoading }) => ({
  title,
  author,
  reviews,
  rating,
  isLoading
});

Ответы [ 2 ]

0 голосов
/ 18 октября 2018

Есть ли способ, которым состояние, возвращаемое редуктором в хранилище, не будет заключено в какой-либо объект {ключ объекта, такой же, как имя редуктора}, чтобы я мог упростить функцию mapStateToProps, как показано ниже

Да, вы можете удалить combineReducers(): 

export default userDetails;

Тем не менее, это не очень хорошая идея для меня, потому что это означает, что вы должны хранить все в одном редукторе.Для простых приложений это может быть хорошо, но для более сложных приложений очень полезно иметь ключи верхнего уровня в объекте состояния для организации данных.

С учетом вышесказанного, я думаю, вы проделали большую работуза небольшую выгоду в mapStateToProps().Вы можете упростить это до этого: 

const mapStateToProps = state => {
    if (state.userDetails) {
        return state.userDetails;
    } else {
        return {};
    }
}
0 голосов
/ 18 октября 2018

Вот что combineReducer делает здесь 

import { combineReducers } from "redux";
import userDetails from "./userDetails";    
export default combineReducers({
  userDetails
});

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

Если вы хотите получить плоское состояние (что, безусловно, выВы передумаете позже), вы просто либо:

  • экспортируйте userDetails как есть (не нужно combineReducers), но вы сможете использовать только один редуктор.
  • используйте другую функцию для объединения состояний, имен reduceReducers (проверьте пакет reduce-reducers в npm).
...