zoukankan      html  css  js  c++  java
  • react进阶第一讲jsx

    createElement

    React.createElement(
    type,
    [props],
    [...children]
    )

    • 第一个参数:如果是组件类型,会传入组件对应的类或函数;如果是 dom 元素类型,传入 div 或者 span 之类的字符串。
    • 第二个参数:一个对象,在 dom 类型中为标签属性,在组件类型中为 props 。
    • 其他参数:依次为 children,根据顺序排列。
    <div>
       <TextComponent />
       <div className="Li">hello,world</div>
       let us learn React!
    </div>
    

    上面的代码会被 babel 先编译成:

     React.createElement("div", null,
            React.createElement(TextComponent, null),
            React.createElement("div", {className:'Li'}, "hello,world"),
            "let us learn React!"
        )
    

    clonElement

    React.cloneElement(
    element,
    [config],
    [...children]
    )

    几乎等同于:

    <element.type {...element.props} {...props}>{children}</element.type>
    

    以 element 元素为样板克隆并返回新的 React 元素。config 中应包含新的 props,key 或 ref。返回元素的 props 是将新的 props 与原始元素的 props 浅层合并后的结果。新的子元素将取代现有的子元素,如果在 config 中未出现 key 或 ref,那么原始元素的 key 和 ref 将被保留。

  • 相关阅读:
    三种等待时间的区别
    多种测试的测试方法
    测试面试题总结
    自动化过程中定位不到元素时使用等待方法
    账号登录测试,多表查询
    TP商城添加购物车自动化测试
    二十四个球
    老鼠喝药
    购物车测试点
    前后端分页
  • 原文地址:https://www.cnblogs.com/renzhiwei2017/p/15617488.html
Copyright © 2011-2022 走看看