ReactDom.render和React.render的區別

這個是react最新版api，也就是0.14版本做出的改變。主要是為了使React能在更多的不同環境下更快、更容易構建。于是把react分成了react和react-dom兩個部分。這樣就為web版的react和移動端的React Native共享組件鋪平了道路。也就是說我們可以跨平臺使用相同的react組件。

?新的react包包含了React.createElement，.createClass，.Component，.PropTypes，.children以及其他元素和組件類。這些都是你需要構建組件時助手。?

而react-dom包包括ReactDOM.render，.unmountComponentAtNode和.findDOMNode。在?react-dom/server?，有ReactDOMServer.renderToString和.renderToStaticMarkup服務器端渲染支持。

總的來說，兩者的區別就是：ReactDom是React的一部分。ReactDOM是React和DOM之間的粘合劑，一般用來定義單一的組件，或者結合ReactDOM.findDOMNode（）來使用。更重要的是ReactDOM包已經允許開發者刪除React包添加的非必要的代碼，并將其移動到一個更合適的存儲庫。

ReactDOM.render的用法：

<!DOCTYPE html>
<html>
<head><title></title><meta  charset="utf-8"><script type="text/javascript" src="../js/react.min.js"></script><script type="text/javascript" src="../js/react-dom.min.js"></script><script type="text/javascript" src="../js/browser.min.js"></script>
</head>
<body>
<div id="a"></div><script type="text/babel">ReactDOM.render(<h1>React入門教程</h1>,
    document.getElementById("a")
);
</script>
</body>

React.render的用法：

<!DOCTYPE html>
<html>
<head><title></title><meta  charset="utf-8"><script type="text/javascript" src="../js/react.min.js"></script><script type="text/javascript" src="../js/react-dom.min.js"></script><script type="text/javascript" src="../js/browser.min.js"></script>
</head>
<body>
<div id="a"></div><script type="text/babel">React.render(<h1>React入門教程</h1>,document.getElementById("a"));
</script>
</body>
</html>

轉載于:https://www.cnblogs.com/TTTK/p/6126352.html

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/news/285308.shtml
繁體地址，請注明出處：http://hk.pswp.cn/news/285308.shtml
英文地址，請注明出處：http://en.pswp.cn/news/285308.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！