在执行脚本时,
documentelement尚不可用,因为
script其本身位于中
head。虽然这是一个有效的解决方案,以保持
script在
head和渲染的
DOMContentLoaded情况下,它甚至不如
把你
script在最底层的
body和 渲染根组件到
div之前它是这样的:
<html><head></head><body> <div id="root"></div> <script src="/bundle.js"></script></body></html>
并在中
bundle.js致电:
React.render(<App />, document.getElementById('root'));您应始终渲染为div
而不是嵌套body
。否则,
body当React不期望时,各种第三方代码(Google字体加载器,浏览器插件等)都可以修改DOM节点,并导致难以跟踪和调试的奇怪错误。阅读有关此问题的更多信息。
放在
script底部的好处是,如果您将React Server渲染添加到项目中,则在脚本加载之前它不会阻止渲染。
更新:(2015年10月7日|
v0.14)
React.render已弃用,请ReactDOM.render改用。
例:
import ReactDOM from 'react-dom';ReactDOM.render(<App />, document.getElementById('root'));


