Reactjs 在redux+；react web app，如何知道一个异步操作最终被分派到状态

Rudx thunk在调度异步操作方面做得很好，它最终将修改异步操作中获取的状态。但是我怎么知道它最终修改获取的redux状态的时刻呢

在我的例子中，我想从服务器读取配置，因为有些组件需要这些配置，所以我必须在获取配置后呈现整个应用程序。但到目前为止，我无法通过使用redux thunk或任何其他redux异步中间件来解决这个问题

更新#1显示一些代码以更好地表达自己。

// reducer
(state, action) => Object.assign({}, state, {config: action.config});

// action creator
const fetchConfig = () => (dispatch) => {
    fetch('http://server.com/...')
    .then(config=>dispatch({type: 'LOAD_CONFIG', config}))
}

// connect reducer to state
createStore({config: configReducer})

// render
import { render } from 'react-dom';
render (<App><News /></App>)

// some component consume state.config
@connect(state=>{config: state.config})
const News = props=>(
    <div>
        {(props.config === '...')? <div>...</div> : <div>...</div>}
    </div>
)

//减速机
（state，action）=>Object.assign（{}，state，{config:action.config}）；
//动作创造者
const fetchConfig=（）=>（分派）=>{
取（'http://server.com/...')
.then（config=>dispatch（{type:'LOAD_config'，config}））
}
//将减速器连接到状态
createStore（{config:configReducer}）
//渲染
从'react dom'导入{render}；
渲染（）
//某些组件使用state.config
@连接（状态=>{config:state.config}）
const新闻=道具=>(
{（props.config=='…'）？…：…}
)

上述操作看起来不错，但是由于该操作可能需要时间，并且在组件首次渲染后更新状态，因此组件可能会显示意外结果。我真正想做的是（我只写下渲染部分，其他部分应该是相同的）：

//渲染
loadConfigFinished
。然后（（）=>渲染（（）））

或

//渲染
在（'loadConfigFinished'，（）=>render（（））；

也许，我应该用第二种方法，只是怕它不是redux-y

无论如何，上面只是一个例子，说明了当某个操作最终分派到redux状态时，有时确实需要通知我们

export function readConfig() {
  return (dispatch) => {
    dispatch(readingConfig());

    someAsyncFunction((error, result) => {
      if (!error) {
        dispatch(readConfigSuccess(result));
      } else {
        dispatch(readConfigFail(error));
      }
    });
  }
}

当然，

readConfigSuccess

、

readConfigFail

和

readingConfig

是返回操作对象的操作创建者函数，例如：

export const READING_CONFIG = 'READING_CONFIG';
export function readingConfig() {
  return {
    type: READING_CONFIG,
  }
}

当然，

readConfigSuccess

、

readConfigFail

和

readingConfig

是返回操作对象的操作创建者函数，例如：

export const READING_CONFIG = 'READING_CONFIG';
export function readingConfig() {
  return {
    type: READING_CONFIG,
  }
}

---

当还原程序处理readConfigSuccess操作时，它们会更新redux状态

应用程序将使用更新的道具重新呈现所有状态更改，因此此特定操作没有任何特殊之处

除此之外，通常只有一小部分状态发生更改，并且重新渲染器看起来与之前的渲染非常相似，在这里，我希望此特定操作的还原器会更改相对较大的一部分状态，并且重新渲染器将渲染一个变化很大的应用程序

不过，这不需要你担心，它应该会起作用

---

或者您的意思是其他，您是否希望在检索配置后执行更多异步工作？

当还原程序处理readConfigSuccess操作时，它们会更新redux状态

应用程序将使用更新的道具重新呈现所有状态更改，因此此特定操作没有任何特殊之处

除此之外，通常只有一小部分状态发生更改，并且重新渲染器看起来与之前的渲染非常相似，在这里，我希望此特定操作的还原器会更改相对较大的一部分状态，并且重新渲染器将渲染一个变化很大的应用程序

不过，这不需要你担心，它应该会起作用

---

或者你是说别的什么，你想在检索配置后做更多的异步工作吗？

看看你的代码，我想你的问题很简单：什么时候在等待数据的同时，不将

未定义的
传递到我的组件中，呈现依赖于服务器数据的组件

我会有一个连接到配置状态的容器组件，并有条件地呈现需要它的组件，或者一个加载模板：

const Container=props=>{
if（props.config）{
返回
}否则{
返回
}
}
查看您的代码，我想您的问题很简单：何时呈现依赖于服务器数据的组件，同时等待该数据，而不将未定义的
传递到我的组件中

我会有一个连接到配置状态的容器组件，并有条件地呈现需要它的组件，或者一个加载模板：

const Container=props=>{
if（props.config）{
返回
}否则{
返回
}
}
我没有解决我的问题。我想在我的组件中使用此配置，因此我必须执行以下操作：　readConfig（）.then（ReactDOM.reander（…）。我必须看看你的一些代码。你能编辑你的文章以包含其中的一些吗？那样使用
ReactDOM.render
似乎不正确。我没有解决我的问题。我想在我的组件中使用此配置，因此我必须执行以下操作：　readConfig（）.then（ReactDOM.reander（…）。我必须看一下你的一些代码。你能编辑你的帖子以包含其中一些吗？使用
ReactDOM.render
那样做似乎不正确。我没有清楚地表达自己，所以我更新了我的问题以更好地表达我自己，你能看一下吗？我没有清楚地表达自己，所以我更新了我的问题以更好地表达我自己，你愿意吗看一看？很聪明。但我只是担心我必须使用config将逻辑放入每个组件中。是的，这是使用React/Redux的一般舞蹈：如何尽可能少地传递状态，因为所有的东西都被传递了？…如果config是如此普遍，你可能想在服务器上内联这些值，或者进行服务器端渲染ng.我有点认为redux thunk是异步操作的走走式解决方案，因为它基本上是一个最终一致性模型。我不知道什么时候会发生，但有时这一时刻很重要，尤其是在初始化订单时。看看redux传奇。更细粒度的控制流，使用衍生的es6生成器，这对wo来说非常酷rk
export const READING_CONFIG = 'READING_CONFIG';
export function readingConfig() {
  return {
    type: READING_CONFIG,
  }
}