Question

我有以下react-redux状态：

{
  response: {
    json: [],
    waitingForResponse: false,
    communicationError: false,
    searchButtonDisabled: true
  },
  routing: {
      ...
    }
  }
}

我想建立一个结构更好的州，如下：

{
  app: {
      home: {
          searchButtonDisabled: true
      },
      warning: {
          waitingForResponse: false,
          communicationError: false
      },
      rest: {
          json: [],
          httpStatus: 200
      }
  },

  routing: ...
}

我想我需要对商店定义做一些魔术。我当前的App.js文件看起来像这样

const store = createStore(
    combineReducers({
        response: reducer,
        routing: routerReducer
    }),
    composeEnhancers(applyMiddleware(thunk))
);

构建这个结构是否有意义，或者只是让我的代码更复杂而没有任何额外的好处？

如果这不是一个好主意，那么我可以在原始属性的名称前添加一些前缀：

{
  response: {
    restJson: [],
    restHttpStatus: 200,

    warningWaitingForResponse: false,
    warningCommunicationError: false,

    homeSearchButtonDisabled: true
  },
  routing: {
    locationBeforeTransitions: {
      pathname: '/hello/',
      ...
    }
  }
}

构建更大的状态组件的最佳做法是什么？

Answer 1

正常化（尽可能保持平坦）将使您的生活从长远来看更容易，尽管没有硬性规定。

关于它的官方文档： http://redux.js.org/docs/recipes/reducers/NormalizingStateShape.html

Mark Erikson已经写了很多好东西： https://hashnode.com/post/what-are-the-best-practices-when-normalizing-redux-data-cive6wc8b08aj3853mvjpfsh1

Redux状态具有更好的结构

1 个答案: