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的深入浅出的更多相关文章

  1. React.js - 入门

    React.js - 第1天 1. React简介 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 ...

  2. React入门看这篇就够了

    摘要: 很多值得了解的细节. 原文:React入门看这篇就够了 作者:Random Fundebug经授权转载,版权归原作者所有. React 背景介绍 React 入门实例教程 React 起源于 ...

  3. [转]React入门看这篇就够了

    摘要: 很多值得了解的细节. 原文:React入门看这篇就够了 作者:Random Fundebug经授权转载,版权归原作者所有. React 背景介绍 React 入门实例教程 React 起源于 ...

  4. ReactiveNative学习之Diff算法

    React 源码剖析系列 - 不可思议的 react diff深入浅出React(四):虚拟DOM Diff算法解析React diff 算法总结链接引用的文章React出于性能的考虑,为了避免频繁操 ...

  5. 深入浅出React Native 2: 我的第一个应用

    这是深入浅出React Native教程的第二篇文章. 1. 环境配置 React Native环境配好之后,就可以开始创建我们的第一个App啦. 打开控制台,输入 react-native init ...

  6. 深入浅出React Native 3: 从零开始写一个Hello World

    这是深入浅出React Native的第三篇文章. 1. 环境配置 2. 我的第一个应用 将index.ios.js中的代码全部删掉,为什么要删掉呢?因为我们准备从零开始写一个应用~学习技术最好的方式 ...

  7. 深入浅出 React Native:使用 JavaScript 构建原生应用

    深入浅出 React Native:使用 JavaScript 构建原生应用 链接:https://zhuanlan.zhihu.com/p/19996445 原文:Introducing React ...

  8. 深入浅出React的一些细节——State

    (来源于: https://facebook.github.io/react/docs/state-and-lifecycle.html 翻译by:@TimRChen) Using State Cor ...

  9. 深入浅出React Native 1: 环境配置

    该教程主要介绍如何用react native来开发iOS,所以首先,你需要有一台mac,当然黑苹果也是可以的~ 创建一个react native的项目只需要安装以下五个组件~~(但....坑爹的是,不 ...

随机推荐

  1. android menu事件

    @Override public boolean onCreateOptionsMenu(Menu menu) { menu.add(0,1,1,R.string.exit); menu.add(0, ...

  2. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  3. jsp学习笔记总结

    Cookie中对保存对象的大小是有限制的 解决cookie中无法保存中文的问题: request.setCharacterEncoding URLEncoder.encode()编码 URLDecod ...

  4. 您可能试图从server上的安全浏览器訪问此站点。请启用脚本然后又一次载入此页。

    您可能试图从server上的安全浏览器訪问此站点.请启用脚本然后又一次载入此页.         我使用域Admin组的账户登入SharePoint2010的server,打开SharePoint首页 ...

  5. linux下使用无线网卡的命令行方法(wifi,iwconfig)

    原文地址:linux下使用无线网卡的命令行方法(wifi,iwconfig) 作者:andyhzw (1)首先关闭开发板的有线网卡 [root@FriendlyARM /]# ifconfig eth ...

  6. Centos6.8防火墙设置

    # 查看防火墙状态 service iptables status   # 停止防火墙 service iptables stop   # 启动防火墙 service iptables start   ...

  7. 数组、栈、堆(java基础知识五)

    1.数组概述.定义格式 * A:数组概念 数组是存储同一种数据类型多个元素的集合.也可以看成是一个容器. 数组既可以存储基本数据类型,也可以存储引用数据类型. * B:数组定义格式 格式1:数据类型[ ...

  8. Android 走向MD的配色风格

    这是一些google官方推出的推荐色值 下面补充上对应的xml文件,省得大家再去自己写 <?xml version="1.0" encoding="utf-8&qu ...

  9. html5--6-9 CSS选择器6--伪类选择器

    html5--6-9 CSS选择器6--伪类选择器 实例 @charset="UTF-8"; /*:root{background: green}*/ /*li:first-chi ...

  10. windows下关闭指定端口服务,解决tomcat端口占用问题

    http://blog.aizhet.com/Server/640.html 在windows下做java EE的开发时:搭建 Eclipse+tomcat的java web开发环境:在应用之中经常遇 ...