我可以在ReactDOM.render回调中做一些初始工作吗？

问题描述：

我找到ReactDOM.render有一个callback params。我可以在ReactDOM.render回调中做一些初始工作吗？

ReactDOM.render(element, container, [callback]);

所以，我的想法是，也许我可以做一些初步的工作。

它可以是：

派遣全球行动，以从服务器获取数据初始化我的全球状态。

我的问题是我想让我的组件尽快呈现。

在呈现静态内容之后，我将执行一些ajax操作符来获取数据。

这是工作吗？或者，我该怎么用callback params？

这里是我的情况：

现在，src/index.js

//some initial work 
//sync and async work. 
//... 

ReactDOM.render(<App/>, document.getElementById('app'))

我的想法是改变src/index.js这样的：

ReactDOM.render(<App/>, document.getElementById('app'),() => { 
    //some initial work 
    //sync work will block the html parse and render. 
    //my idea is let react component render as soon as possible 
})

我不知道我的想法是正确的或不。感谢您的回复。

编辑

最初的工作不仅意味着ajax，可cordova或东西native client提供。

提取不应该被阻止。也许你正在做一些阻塞的重处理，但这可以在工作人员中完成。 – Aaron

在componentDidMount（）方法中提取数据。 – c0deNinja

@ c0deNinja是的，我可以做到这一点。但我想知道我能用'react-dom render callback'做什么？ – novaline

答

对于您尝试使用它的任务，没有必要使用render()方法回调。事实上，据我所知，这个回调并不意味着发出初始化请求;的确，你将不能访问到组件的回调，而您可能需要设置一些状态，当初始化完成 ...

以下意见编辑的部分：我的ReactDOM个人观点呈现回调是因为它将React与另一个库/框架集成在一起，而不知道React。就像：你需要在组件被渲染时执行一个动作，只要它在DOM树中变得可用;一旦调用渲染回调函数，就可以确定组件已经呈现给DOM。

就你而言，我宁愿创建一个根组件并委托给它的AJAX调用。我会呈现一个App组件，该组件反过来呈现所有其他组件。在这个App组件中，我将在componentDidMount中进行初始化。

另一种选择是创建容器组件，即。一个包含更简单组件的逻辑组件。然后，像以前的解决方案一样实施componentDidMount。

一些灵感：React AJAX best practices

然后，渲染回调是什么？那里有哪些类型的行动可能有用？ – jmargolisvt

感谢您的回复。我知道你在说什么。根容器组件''。是的，最近，我会尝试将我的初始工作从'index.js'移动到'''componentDidMount'。我会看看'chrome'的'timeline'来寻找一些东西。 – novaline

但是，我仍然想知道什么时候应该使用'react-dom'' render''callback'。与@jmargolisvt相同。 – novaline

我可以在ReactDOM.render回调中做一些初始工作吗？

相关推荐