React 和 React-DOM

阅读数:1606 发布时间:2016-05-08 08:49:11

作者:zzl005 标签: react react-dom 朱忠来005

React 0.14版的其中一个变化

2015年的10月7号,React 发布了0.14版,其中的一个很重要的变化就是React 和 React-dom 的分离。

React-dom 被单独抽离出来,现在分为 React 和 React-dom 两个package,原来的 React.render 现在划归到了 React-dom 下面,成了 ReactDOM.render。

现在基本组件的标准写法是:

var React = require('react');
var ReactDOM = require('react-dom');

var MyComponent = React.createClass({
  render: function() {
    return <div>Hello World</div>;
  }
});

ReactDOM.render(<MyComponent />, node);

其中,第二行(之前的写法没有):

var ReactDOM = require('react-dom');

最后一行:

ReactDOM.render(<MyComponent />, node);

原来是

React.render(<MyComponent />, node);

在实际的 Demo 中

一开始:

var React = require('react');
var Main = require('./components/Main.jsx');

React.render(
  <Main />,
  document.body
);

控制台会报:
react-waring

修改之后:

var React = require('react');
var ReactDOM = require('react-dom');
var Main = require('./components/Main.jsx');

ReactDOM.render(
  <Main />,
  document.body
);

控制台的 warning 消失。

Demo里,React 的版本是0.14.8,在 React 0.14版的升级公告中,有以下几句,值得注意:

If your code is free of warnings when running under React 0.13, upgrading should be easy. We have two new small breaking changes that didn't give a warning in 0.13 (see below). Every new change in 0.14, including the major changes below, is introduced with a runtime warning and will work as before until 0.15, so you don't have to worry about your app breaking with this upgrade.

详情见官方的React0.14升级公告 也就是说,0.15 版之前,上面讨论的 React.render();,到 ReactDOM.render() 的这种写法的变化,只会报 warning ,并不会造成严重的问题,不过,还是推荐切换到新的写法。

相关文章推荐: