Javascript 反应：在异步事件后更新组件未连接到组件

在我的应用程序中，我有一个依赖于状态的组件，它将在组件内部未处理的异步事件之后更新

var Status = React.createClass({
    getInitialState: function () {
        return {
            state: 'loading'
        };
    },
    render: function () {
        return React.createElement('span', null, this.state.state);
    }
});

var status = React.createElement(Status);
React.render(status, mountNode);

我希望能够做到以下几点：

doAsyncThing(function callback() {
    status.setState({ state: 'done' });
});

---

我知道异步逻辑可以移动到

componentDidMount

，如图所示，但是可以将其移动到组件之外吗？或者仅仅是将这种逻辑放在组件内部的简单方法？

Pubsub模式可能是您的解决方案（在这种情况下，使用主干）：

然后在

doasynchThing

回调中触发

done

事件：

doAsyncThing(function callback() {
    ps.trigger('done');
});

---

我确实会将它放在componentDidMount中，但您可以选择将您的呼叫放在外部，并将您对成功将数据传递到道具的看法呈现出来

此外，这被视为一种防振型，除非这仅适用于初始荷载

见此：

编辑：这里有一个更清楚的解释，同样的问题

最简单的方法是使用componentDidMoun：

---

酒吧/酒吧会管用，但我认为这太过分了，也许不是最好的解决办法。让我知道你的想法。

你可以设置一个pubsub模式，这是文档中提到的另一个备选方案。可能重复@axxis，尽管问题类似（另一个可能更具体），但该问题的公认答案是，设置一个全局变量回调并调用该回调，混乱且不可用（不能让多个组件在事件发生时更改状态）。pubsub模式是健壮且可重用的。这是真的，那么也许你应该看看Flux模式与elclanrs的想法一样，与pubsub一起使用，除了：将

status.setState

更改为

this.setState

以实现可重用性。同样假设

pb

应该是

ps

@keizom是的，pubsub可以解耦我们的组件。它应该是ps:）假设我在另一个模块中有异步函数，并且我正在将它导入组件模块。在这种情况下，如何使用setState？我问了同样的问题，但没有得到任何回应。是的，这是一种反模式。是的，使用道具作为初始状态是可以接受的。但是，您建议异步完成后“将数据传递到道具”，这是不一样的。我不明白您在说什么。它将数据传递到道具中进行初始渲染。这就是链接中描述的内容。你可以在异步结束后，或者出去走走后，按照你的意愿来做。你要向道具传递什么数据？异步结束后你会做什么？代码可以帮助您更清楚地解释。在呈现mycall时，您正在传递回调/事件/wtv的数据。成功：函数（数据）{}类似于这样的事情让我们按时间顺序思考：1）在异步完成之前，我创建了一个组件，并且没有传递任何内容给initialdata。2） 异步完成后，我重新创建组件并将

数据

传递到

初始数据

。在这种情况下，

initialdata

不是首字母；它的价值发生了变化。

doAsyncThing(function callback() {
    ps.trigger('done');
});