与 Reactjs 语法混淆答案

【问题标题】：Confusion with Reactjs syntax与 Reactjs 语法混淆
【发布时间】：2017-03-13 03:18:31
【问题描述】：

我对此很陌生，所以请大家多多包涵。我研究过 React，其中创建了一个组件，例如，

var app = React.createClass({ ... });

就像here。

但是，在我的 mac 中安装 react 之后，我发现语法与我习惯的有点不同。即，

class Application extends React.Component { ... }

就像here。

现在，由于我对 Java 的了解，我确实理解了代码。但我只是想知道区别。事实证明这对我来说是个问题，因为当我编写像 React.createClass() 这样的语法时，它不起作用。

如果您查看第二个link in codepen，您会发现 Babel 是在 JS 旁边编写的。那么，react 默认使用 Babel 吗？

我想你明白了。谢谢！

【问题讨论】：

第一种形式使用 ES5，第二种形式使用 ES6 语法。
你可能会通过谷歌搜索得到更好的答案，而不是等待有人在这里解决它。 React.createClass 还添加了一些使用 ES6 类语法时不会出现的好东西（例如函数自动绑定）。这篇文章似乎对这个主题很有用：reactjsnews.com/composing-components

【解决方案1】：

您的第一个示例使用 React.createClass() 辅助函数，而第二个示例使用 ES6 class syntax 定义 React 组件。

两者都是定义组件的有效方法。但是请注意，您需要在发布之前将 ES6 代码转换为 ES5，以使其跨浏览器兼容。

【讨论】：