是否可以在DOM中多次使用React.render()?
我想要使用React在整个DOM中多次添加组件。 这小提琴显示我想要做什么,它不会抛出任何错误。 代码如下:
HTML:
<div id="container"> <!-- This element's contents will be replaced with the first component. --> </div> <div id="second-container"> <!-- This element's contents will be replaced with the second component. --> </div>
JS:
var Hello = React.createClass({ render: function() { return <div>Hello {this.props.name}</div>; } }); React.render(<Hello name="World" />, document.getElementById('container')); React.render(<Hello name="Second World" />, document.getElementById('second-container'));
我已经看到了这个问题 ,恐怕通过这样做会使React组件互相干扰。 这个问题的答案build议使用服务器端渲染,这不是我的select,因为我使用的是Django服务器端。
另一方面,也许我在做什么是好的,因为我只有一个React库的实例挂载(而不是多个组件调用自己的React实例)?
这种使用多个DOM实例的方式可以使用React吗?
是的,在同一页面上多次调用React.render
是完全正确的。 就像你所build议的那样,React库本身只加载一次,但是每次调用React.render
都会创build一个独立于其他组件的新组件实例。 (事实上,在过渡到React的网站上,这种情况并不less见,其中网页的某些部分是使用React.render
生成的,其他部分则不是。)