• react


    一、发展史
    1.起源与facebook的内部项目,主要开发view的js库。
    2.app的分类 :Native app原生app(ios,android)->各方面都最优。但不能跨平台
    webApp,webpack,Hbulider 打包app->跨平台,硬件支持比较弱。
    react native:开发方式如webApp简洁,但是有Native app的性能
    二、特点
    1.虚拟DOM
    2.组件化开发
    3.JSX语法(可以不使用,Reat依旧可以运行)可以直接写js
    三、使用
    1.下载http://reactjs.cn/react/downloads.html
    2.引入文件:react.js(React核心库)
    react-dom.js(提供与DOM相关的功能)
    browser.js(将JSX语法转换为Javascript语法)
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>

    四、ReactDOM.render()
    1.作用:用于将模板转换为html并插入到指定的DOM节点
    2.使用:ReactDOM.render(模板,DOM节点[,回调函数,一般不用])
    五、JSX语法
    1.HTML 语言直接写在 JavaScript 语言之中,不加任何引号,这就是 JSX 的语法,它允许 HTML 与 JavaScript 的混写
    2.JSX基本语法规则:遇到 HTML 标签(以 < 开头),就用 HTML 规则解析;遇到代码块(以 { 开头),就用 JavaScript 规则解析;
    3.当要插入的变量是数组时,会展开数组的所有成员
    六、组件(Component)
    1.React 允许将代码封装成组件(component),然后像插入普通 HTML 标签一样,在网页中插入这个组件。
    2.方法:React.createClass()
    3.注意:
    a.组件类的第一个字母必须大写,否则会报错
    b.组件类有且只能有一个顶层标签,否则也会报错
    c.组件的用法与原生的 HTML 标签完全一致,可以任意加入属性;组件的属性可以接受任意值,字符串、对象、函数等等都可以
    d.组件的属性可以在组件类的 this.props 对象上获取,比如 name 属性就可以通过 this.props.name 读取 e.class 属性需要写成className ,for 属性需要写成htmlFor ,这是因为 class 和 for 是 JavaScript 的保留字
    f.所有组件类都必须有自己的 render 方法,用于输出组件
    七、this.props.children
    1.this.props 对象的属性与组件的属性一一对应,但是有一个例外,就是 this.props.children 属性
    2.this.props.children:表示组件的所有子节点
    3.this.props.children 的值有三种可能:如果当前组件没有子节点,它就是 undefined ;如果有一个子节点,数据类型是 object ;如果有多个子节点,数据类型就是 array
    4.React 提供一个工具方法 React.Children 来处理 this.props.children
    5.React.Children.map 来遍历子节点,而不用担心 this.props.children 的数据类型是 undefined 还是 object

  • 相关阅读:
    scanf与scanf_s的区别
    PAT 1041 考试座位号
    PAT1018 锤子剪刀布
    Cookie
    JSP--原理
    多线程练习题
    Java线程--线程的同步与锁
    有关toString()和println(Object)
    Java Web请求和响应机制
    IO流
  • 原文地址:https://www.cnblogs.com/zouxianlu/p/6780047.html
Copyright © 2020-2023  润新知