8、手把手教React Native实战之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
##8、配套视频(下载地址):https://yunpan.cn/cYid89wLX5w3c 访问密码 3f0d
8、手把手教React Native实战之ReactJS组件生命周期的更多相关文章
- 7、手把手教React Native实战之ReactJS
ReactJS核心思想:组件化 维护自己的状态和UI 自动重新渲染 多个组件组成了一个ReactJS应用 React是全局对象 顶层API与组件API React.createClass创建组 ...
- 6、手把手教React Native实战之JSX入门
React是由ReactJS与React Native组成,其中ReactJS是Facebook开源的一个前端框架,React Native是ReactJS思想在native上的体现! JSX并不是一 ...
- 3、手把手教React Native实战之flexbox布局
flexbox是Flexible Box的缩写,弹性盒子布局 主流的浏览器都支持 flexbox布局是伸缩容器(container)和伸缩项目(item)组成 Flexbox布局的主体思想是元素可以 ...
- 5、手把手教React Native实战之盒子模型BoxApp
用HTML5和React Native分别实现盒子模型显示 写法不一样: 1.样式 
###伸缩项目的属性 1.order 定义项目的排列顺序,数值越小,排列越靠前,默认值为0,语法为:order:整数值 2.flex-grow 定义伸缩项目的放大比例,默认值为0,即表示如果存在剩余空 ...
- 2、手把手教React Native实战之从React到RN
###React简介 RN是基于React设计,了解React有助于我们开发RN应用: React希望将功能分解化,让开发变得像搭积木一样,快速而且可维护 React主要有如下3个特点: *作为UI( ...
- 1、手把手教React Native实战之环境搭建
React Native 的宗旨是,学习一次,高效编写跨平台原生应用. 在Windows下搭建React Native Android开发环境 1.安装jdk 2.安装sdk 在墙的环境下,为了 ...
- 0、手把手教React Native实战之开山篇
##作者简介 东方耀 Android开发 RN技术 facebook github android ios 原生开发 react reactjs nodejs 前端 ...
- React Native学习(十)—— 生命周期
本文基于React Native 0.52 Demo上传到Git了,有需要可以看看,写了新内容会上传的.Git地址 https://github.com/gingerJY/React-Native-D ...
随机推荐
- v-for设置键值 key
总是用 key 配合 v-for.在组件上_总是_必须用 key 配合 v-for,以便维护内部组件及其子树的状态. <ul> <li v-for="todo in tod ...
- STL源码剖析(list)
SGI STL中list是使用环状双向链表实现的.它的结点结构定义如下: template <class T> struct __list_node { typedef void* voi ...
- RxJava API使用示例
概述 RxJava API示例代码,可离线查看rxjava1.0大部分API的marble图,描述,示例代码,并支持示例代码实时输出及展示执行结果. 详细 代码下载:http://www.demoda ...
- hibernate的配置, 增删改查
路径:查找路径 实际上都是查找编译后的对应的路径,在bin文件夹中总 增删改必须开启事务才行 hibernate加载文件的两种方式 configure 1.引包 antlr-2.7.6.jar bac ...
- mysql中的时间类型datetime,date,time,year,timestamp小知识点
1.datetime,date,time,year四个类型的值,可以手动输入,也可以调用函数获得值 ① 手动输入,格式如下: datetime "2016-6-22 14:09:30&quo ...
- Android给TextView设置透明背景、圆角边框
第一种方法:在drawable文件夹下新建一个文件设置背景样式 代码: 在drawable文件夹下面新建text_view_border.xml <?xml version="1.0& ...
- DEDECMS 添加栏目图片
当我们一个栏目列表都用缩略图来表示产,而不仅仅只是文字,如果没有这项功能会非常麻烦,网上有很多这方面的资料,但是都试过了有很多问题,自己研究一下,测试基本通过.需要新加字段 typeimg 后台执行S ...
- mysqli常用方法
//返回前一次 MySQL 操作(SELECT.INSERT.UPDATE.REPLACE.DELETE)所影响的记录行数. //一个 > 0 的整数表示所影响的记录行数.0 表示没有受影响的记 ...
- laydate 和 Vue 奇怪的清空问题
laydate的input,会自动被清空,当别的input修改的时候.改成这样既可解决 <td><input type="text" id="retur ...
- Java分布式 一些概念理解
转至 java那些事 2017-02-09 有些朋友工作一年了觉得该深入一下子了,所以想深入学习一下以提升自己的专业技能,想问一下如何入门Java分布式应用,学习过程大致是怎么样的,涉及到那些知识, ...