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);
一开始:
var React = require('react');
var Main = require('./components/Main.jsx');
React.render(
<Main />,
document.body
);
控制台会报:
修改之后:
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 ,并不会造成严重的问题,不过,还是推荐切换到新的写法。
相关文章推荐: