1. 如何集成Redux

用Git合并feature/redux分支。 如果您对feature/react-intl感兴趣,请合并该分支,因为它也包括Redux。

如果你不太了解Redux,你应该首先阅读这里

1.1. 创建Actions

  1. 找到src/constants/index.js文件,在这里定义action名称。
  2. 找到src/actions/文件夹,创建具有适当名称的文件。你可以拷贝src/actions/runtime.js文件作为一个模板。
  3. 如果您需要异步操作,请使用redux-thunk。 有关如何创建异步操作的问题,您可以从feature/react-intl查看setLocale操作。 有关此主题的更多信息,请参阅Async Flow

1.2. 创建Reducer(又叫Store)

  1. 找到src/reducers/文件夹,创建一个新的文件。

    你可以拷贝src/reducers/runtime.js文件作为一个模板。

    • 不要忘记总是需要返回state
    • 不要突然提供state。 如果您突变状态,则由于===相等,渲染连接的组件将不会被触发。 如果执行状态更新,请始终返回新值。 你可以使用这个结构:{ ...state, updatedKey: action.payload.value, }
    • 请记住,存储状态必须通过重播其上的操作来重复。 例如,当您存储时间戳时,将其传递到action payload。 如果您在action中调用了REST API。 在reducer上永远不要这样做!
  2. 编辑src/reducers/index.js,导入您的reducer并将其添加到由combineReducers创建的root reducer。

1.3. 连接组件

您可以使用react-redux包中的connect()高阶组件。

请参阅在redux.js.org上的使用React

例如,您可以从feature/react-intl分支中查看<LanguageSwitcher>组件。 它展示了订阅存储和调度操作。

1.4. 在服务器上调度操作

See source of src/server.js

Copyright © JasperXu 2017 all right reserved,powered by Gitbook修订时间: 2017-04-19 02:05:57