B06.ReactJS.txt
UP 返回
ReactJS核心思想:组件化 维护自己的状态和UI 自动重新渲染
多个组件组成了一个ReactJS应用
React是全局对象 顶层API与组件API
React.createClass创建组件类的方法
React.render渲染,将指定组件渲染到指定DOM节点
render:组件级API,返回组件的内部结构
React.render被ReactDOM.render替代
【【【ReactJS组件生命周期
1.创建阶段
getDefaultProps:处理props的默认值 在React.createClass调用
2.实例化阶段
React.render(<HelloMessage 启动之后
getInitialState、componentWillMount、render、componentDidMount
state:组件的属性,主要是用来存储组件自身需要的数据,每次数据的更新都是通过修改state属性的值,ReactJS内部会监听state属性的变化,一旦发生变化的话,就会主动触发组件的render方法来更新虚拟DOM结构
虚拟DOM:将真实的DOM结构映射成一个JSON数据结构
3.更新阶段
主要发生在用户操作之后或父组件有更新的时候,此时会根据用户的操作行为进行相应的页面结构的调整
componentWillReceiveProps、shouldComponentUpdate、componentWillUpdate、render、componentDidUpdate
4.销毁阶段
销毁时被调用,通常做一些取消事件绑定、移除虚拟DOM中对应的组件数据结构、销毁一些无效的定时器等工作
componentWillUnmount
【【【ReactJS组件通信
ReactJS组件关系是一层套一层,DOM结构 组织结构比较清晰
父组件 子组件
1.子组件如何调用父组件
this.props
2.父组件如何调用子组件
首先用属性ref给子组件取个名字吧
this.refs.名字.getDOMNode().
【【【JSX实战
React Native中没有DOM的概念,只有组件的概念,所以我们在ReactJS中使用的Html标签以及对DOM的操作是不起作用的,但是组件的生命周期、JSX的语法、事件绑定、自定义属性等,在RN和ReactJS中是一样的。
DOWN 返回