Question

简介：我对React有点困惑。我看过文章说React组件只是接收道具并呈现给虚拟DOM的函数。然而，我所看到的是，他们是成熟的有状态怪物，我发现没有办法像功能一样对待它们。

问题：为什么React组件的每次使用都包含在React.createElement中？为什么我不能使用new MyComponent()？当我在DevTools中这样做时，它看起来非常相似。考虑到使用React.createElement创建组件，为什么需要React.createClass？对我来说这似乎是多余的。

修改：这看起来很相似：https://gist.github.com/sebmarkbage/ae327f2eda03bf165261

编辑＃2：这与React.Component vs React.createClass相关，但不是重复，该问题询问有关创建类的问题。我不是要求创建新的组件类，而是要求创建该类的实例（元素）。

Answer 1

我想我found the answer here：

在React 0.12中，我们正在对React.createClass（...）和JSX如何工作进行核心更改。

（...）

目前var Button = React.createClass(...)做了两件事。它   创建一个类和一个辅助函数来创建ReactElements。它是   基本上等同于：
class ButtonClass { }

function ButtonFactory(...args) {   return
React.createElement(ButtonClass, ...args); }

module.exports = ButtonFactory; ```
然后通过调用，在消费组件中访问它 ButtonFactory。
var Button = require('Button');

class App {   render() {
    return Button({ prop: 'foo '}); // ReactElement
} }
从概念上讲，这是错误的模式。源组件不应该   负责App的输出。

这有一些问题：


无法直接导出ES6类，需要将它们包装起来。

没有方便的方法来访问实际的课程，而且令人困惑的是你正在使用的课程。

静态方法包含在非实际功能的帮助程序中。为方便起见。

自动模拟会破坏工厂，因此无法在不禁用模拟的情况下测试渲染结果。

工厂可以被返回与ReactElements不同的其他工厂包装。进行测试和优化   不可能的。

具有对象管理专用功能的语言必须遵循React而不是使用内置功能。</ li>

`React.createElement（...）`和`new MyComponent（）`之间的区别是什么？

1 个答案: