React的深入浅出
react
组件重新渲染有两种途径:
1、自身调用setState;
2、父组件传入新的props。
3、但这两种途径都不会必然调用render而引起重新渲染,
都会先经过shouldComponentUpdate进行判断,
如果返回true,则调用render,就会对该组件的所有子组件传入新的props,
因此所有子组件都会可能重新渲染(但是是否每一个子组件都会更新,
取决与子组件的shouldComponentupdate的返回值)。
1、props:父级分发先来的属性;
2、state:组件内部自行管理的组件;
3、React没有数据向上回溯的能力,数据只能单向向下分发,或自行内部消化。
1、因为React无法让两个组件互相交流,使用对方数据。
解决办法:将state放到共有的父组件中来管理,在作为props分发回子组件。
2、子组件改变父组件state的办法只能是通过onClick触发父组件声明好的回调,
也就是父组件提前声明好函数或方法作为契约描述自己的state将如何变化,
再将它同样作为属性交给子组件使用。这样就出现了一个模式:
数据总是单向从顶层向下分发的,但是只有子组件回调在概念上可以
回到state顶层影响数据。这样state一定程度上是响应式的。
相关链接:
https://www.zhihu.com/question/41312576?sort=created
https://www.zhihu.com/question/29504639
待续。。。。。
React的深入浅出的更多相关文章
- React.js - 入门
React.js - 第1天 1. React简介 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 ...
- React入门看这篇就够了
摘要: 很多值得了解的细节. 原文:React入门看这篇就够了 作者:Random Fundebug经授权转载,版权归原作者所有. React 背景介绍 React 入门实例教程 React 起源于 ...
- [转]React入门看这篇就够了
摘要: 很多值得了解的细节. 原文:React入门看这篇就够了 作者:Random Fundebug经授权转载,版权归原作者所有. React 背景介绍 React 入门实例教程 React 起源于 ...
- ReactiveNative学习之Diff算法
React 源码剖析系列 - 不可思议的 react diff深入浅出React(四):虚拟DOM Diff算法解析React diff 算法总结链接引用的文章React出于性能的考虑,为了避免频繁操 ...
- 深入浅出React Native 2: 我的第一个应用
这是深入浅出React Native教程的第二篇文章. 1. 环境配置 React Native环境配好之后,就可以开始创建我们的第一个App啦. 打开控制台,输入 react-native init ...
- 深入浅出React Native 3: 从零开始写一个Hello World
这是深入浅出React Native的第三篇文章. 1. 环境配置 2. 我的第一个应用 将index.ios.js中的代码全部删掉,为什么要删掉呢?因为我们准备从零开始写一个应用~学习技术最好的方式 ...
- 深入浅出 React Native:使用 JavaScript 构建原生应用
深入浅出 React Native:使用 JavaScript 构建原生应用 链接:https://zhuanlan.zhihu.com/p/19996445 原文:Introducing React ...
- 深入浅出React的一些细节——State
(来源于: https://facebook.github.io/react/docs/state-and-lifecycle.html 翻译by:@TimRChen) Using State Cor ...
- 深入浅出React Native 1: 环境配置
该教程主要介绍如何用react native来开发iOS,所以首先,你需要有一台mac,当然黑苹果也是可以的~ 创建一个react native的项目只需要安装以下五个组件~~(但....坑爹的是,不 ...
随机推荐
- Android Dynamic Action(动态Action)—像访问网页一样地访问Activity
Android Dynamic Action,简称DA,是一种简便.可变Action的实现方案.DA框架的初衷是为了取代Context.startActivity的调用方式,使用建造者模式(Build ...
- Intel的东进与ARM的西征(4)--理想的星空,苹果处理器之野望
http://www.36kr.com/p/200031.html “人生五十年,如梦亦如幻.有生斯有死,壮士何所憾?”之所以没有遗憾,是因为有了理想. 公元 1582 年,日本战国时期最著名的霸主, ...
- LeetCode_DP_Word Break II
LeetCode_Word Break II 一.题目描写叙述: 二.解决思路: 题目要求我们要在原字符串中加空格,使得隔开的每一个词都是词典中的词. 所以我们大能够按顺序扫描每一个字符.可是然后当碰 ...
- Android中Intent具体解释(二)之使用Intent广播事件及Broadcast Receiver简单介绍
通过第一篇的解说,我们已经看到了怎样使用Intent来启动新的应用程序组件,可是实际上他们也能够使用sendBroadcast方法来在组件间匿名的广播消息. 作为一个系统级别的消息传递机制,Inten ...
- Cocos2d-x Vector——vector iterators incompatible
***************************************转载请注明出处:http://blog.csdn.net/lttree************************** ...
- java 的File文件
文件是计算中一种主要的数据存储形式. 首先介绍一下,绝对路径和相对路径.绝对路径是书写完整路径,相对路径是值书写文件的部分路径. d:\java\hello.java 就是据对路径.包括完整的路径d ...
- C++设计模式之State模式
这里有两个例子: 1.https://www.cnblogs.com/wanggary/archive/2011/04/21/2024117.html 2.https://www.cnblogs.co ...
- jdbc navcat for mysql 连不上远程服务器的原因(安全组设置)
如果你权限,防火墙什么都设置好了,但是还是连不上远程数据库, 那么你就必须要看看你的服务器上安全组的设置(很重要) 这里以阿里云为例子(之前用阿里云服务都没设置),现在阿里云的服务器租的时候就要求配置 ...
- 数据结构之 排序---折半插入排序(时间复杂度 O(nlog2 n) )
排序 Time Limit: 1000MS Memory limit: 32678K 题目描述 给你N(N<=100)个数,请你按照从小到大的顺序输出. 输入 输入数据第一行是一个正整数N,第二 ...
- MYSQL进阶学习笔记十:MySQL慢查询!(视频序号:进阶_23-24)
知识点十一:MySQL 慢查询的应用(23) 一.慢查询定义 MySQL记录下查询超过指定时间的语句,我们将超过指定时间的SQL语句查询称为慢查询. 查看时间限制 show variables lik ...