码迷,mamicode.com
首页 > 其他好文 > 详细

react中createFactory, createClass, createElement分别在什么场景下使用,为什么要这么定义?

时间:2016-12-08 23:57:55      阅读:399      评论:0      收藏:0      [点我收藏+]

标签:cti   children   工厂   方法   隔离   actor   edit   依赖关系   定义   

作者:元彦
链接:https://www.zhihu.com/question/27602269/answer/40168594
来源:知乎
著作权归作者所有,转载请联系作者获得授权。

三者用途稍有不同,按依赖关系调整下顺序:
1. createClass,如其名就是创建React组件对应的类,描述你将要创建组件的各种行为,其中只有当组件被渲染时需要输出的内容的render接口是必须实现的,其他都是可选:
var Hello = React.createClass({
    render: function() {
        return <div>Hello Taobao, Hello UED</div>;
    }
});

2. createElement,创建React组件实例,支持type,config,children三个参数:
ReactElement.createElement = function(type, config, children) {
  ...
}
如我们在jsx中描述的 < Hello /> ,编译后就是 React.createElement(Hello)

3. createFactory,通过工厂方法创建React组件实例,在js里要实现工厂方法只需创建一个带type参数的createElement的绑定函数:
ReactElement.createFactory = function(type) {
  var factory = ReactElement.createElement.bind(null, type);
  return factory;
};
创建模式目的是隔离与简化创建组件的过程,模式的东西自然是可用可不用,如果需要批量创建某个组件时,可以通过工厂方法来实现:
var h = React.createFactory(Hello);
h({x:1})
h({x:2})
h({x:3})

react中createFactory, createClass, createElement分别在什么场景下使用,为什么要这么定义?

标签:cti   children   工厂   方法   隔离   actor   edit   依赖关系   定义   

原文地址:http://www.cnblogs.com/huenchao/p/6147022.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!