Modal组件在以class *** extends Component 开发React组件时使用问题
HSUCHING opened this issue · 2 comments
HSUCHING commented
看了下作者源代码,有几个问题想问下.如果在下有说的不对的地方希望指出。
看了下Modal组件里面的这行代码:
const div = document.createElement('div')
document.body.appendChild(div)
const container = ReactDOM.render(<Container />, div)
我的理解作者应该是想做成做成单例,使用的时候就一直在这个Container里面做增加modal和删减Modal之用。*那么我的问题是:这行代码如果我在创建自己页面或者是组件时使用import Modal from '/Modal'时就会执行这段代码,明显这时页面的DOM不一定就位,那么浏览器就会有提示说这样写是有问题的。
当然强引是可以搞定的,不过如果作为组件去使用的话,我觉得应该用的优雅点好。请问下有什么方式是可以优雅的使用它的?
Lobos commented
呃,因为我们从来不在head里面引用js,而是在body里面引用,所以一直没有注意这个问题。
最简单的解决方式,也是比较推荐的方式是在body里面,html的最后面引入js,这样可以避免很多加载的问题。
<html>
<head>...</head>
<body>
<div id="xxx"></div>
...
<script src="xxxx"></script>
</body>
</html>