zoukankan      html  css  js  c++  java
  • react中createFactory, createClass, createElement分别在什么场景下使用,为什么要这么定义?

    作者:元彦
    链接: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})
  • 相关阅读:
    Part 17 Consuming ASP NET Web Service in AngularJS using $http
    Part 16 ng include directive in AngularJS
    Part 15 AngularJS ng init directive
    文本框
    mint上部署lamp环境
    18种有效有趣的读书方法(转载)
    可扩展的架构设计
    iisreset和w3wp的关系
    Ajax请求中带有IPv6地址后的百分号的问题
    IE中JavaScript 的异常处理
  • 原文地址:https://www.cnblogs.com/huenchao/p/6147022.html
Copyright © 2011-2022 走看看