React.render和reactDom.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的用法：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

<! 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 > </ html >

React的用法:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

<! 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://facebook.github.io/react/blog/2015/10/07/react-v0.14.html

原文: http://my.oschina.net/LuckyWinty/blog/637136?p=1