-
Context 的用途：
设计目的是共享那些对于组件来说全局的数据
不要仅仅为了避免在几个层级下的组件传递props而使用context
查看全部 -
#Readme
项目文档
#package.json
项目依赖、命令
#public公共文件
index.html：主页 root节点是程序的主入口
#src文件
app文件与样式文件
#新建组建(使用es6的语法)
1，src文件夹下，创建Welcome.js
2，引入依赖 import
3，新建类 extends React.component
4，新建render(){}方法，显示结果
return <h1> Hello React</h1>
5，导出整个类
export default Welcome
6，把Welcome component挂在到节点上
打开index.js，使用ReactDOM进行挂载
查看全部 -
第一章： 了解react
react 是一个UI库，相当于MVVM中的V
react - a javascript library for building user interfaces
react 受欢迎的原因：
声明式写法-注重结果（相对于命令式-注重过程）// todo 了解这两个思想
组件化，一切基于组件
一处学习，随处编写（web、native）
不过我觉得以上这些原因都太....不符合现实情况了，都是场面话。
react受欢迎的原因，我觉得一是因为facebook，
二是因为生态好，圈子活跃，成熟解决方案较多（1st）
三是相比于angular入门门槛低（也是vue崛起的原因之一），
四是出于前端架构师们的个人喜好吧，目前看来react的爱好者更多一点
查看全部 -
状态提升：
将共享的状态提升至最近的父组件进行管理
自上而下的数据流 top-down data flow
任何可变数据只有一个数据源，在数据源对数据进行管理
和双向绑定的区别：
需使用回调函数
便于寻找debug
查看全部 -
state（状态）
组件内部的数据可以动态改变
this.setState()是更新state的唯一途径
constructor
需要显式调用super（）
方法直接在类中定义，不需要像vue中定义在methods中
方法中的this默认指向是null，可以再构造其中进行绑定
也可以使用箭头函数（=>）
查看全部 -
return <h1>hello react</h1>
返回的事jsx，既不是js也不是html
jsx的属性className=class；htmlFor=for，为了防止和es6的关键字冲突
查看全部 -
State 状态
组件私有的。
查看全部 -
react 生命周期
创建 更新 卸载
查看全部 -
创建Context对象
把想要使用Context数据的节点换成<定义的文件名.Provider></定义的文件名.Provider>
查看全部 -
Context 全局数据
查看全部 -
由上而下的数据流 单向数据流 所以数据处理放在父组件中
子组件向父组件传值：this.props.方法名(值)查看全部 -
受控组件
非受控组件 将真实数据保存在dom中 因此在使用非受控组件时 更容易同时集成React和非React的代码 如果想要快速而随性、并且减少代码量 可以使用非受控组价 否则需要使用受控组件
查看全部 -
示例 使用到了某些生命周期
查看全部 -
组件的生命周期：
组件初始化、组件更新、组件卸载
constructor 数据的初始化
componentWillMount 在挂载前也就是render之前被调用
getDerivedStateFromProps 从props中获取到state
render 插入jsx生成的dom结构
componentDidMount 组件挂载后立即调用 通常在这调用ajax请求
getDerivedStateFromProps
shouldComponentUpdate 到新的props或者state时都会调用，通过返回true或者false告知组件更新与否
render
getSnapshotBeforeUpdate
componentDidUpdate 组件更新结束后触发
componentWillUnmount
查看全部 -
点击事件（两种方式）
onClick={this.handleClick.bind(this)}
onClick={() => {this.handleClick()}}
查看全部
举报