react组件中的两类状态数据:props,state,官网API给出的使用规范,多读几遍,受益匪浅:

结论:

1. 对应任何可变的数据,理应只有一个单一“ 数据源 ”

2. 如果多个组件均需要这些数据,那可以将数据提升至离他们最近的共同祖先中,而不是尝试在不同组件中同步状态

3. 应该依赖自上而下的数据流

图2中所示的“ 炉墙代码 ”按目前的理解应该是在“ getDerivedStateFromProps/shouldComponentUpdate ”中按需求转化输入或者拒绝输入,待续...

4.  可以由其他props或者state推导出来的属性,则很可能不应该出现在state中。

初识react中的状态量的更多相关文章

  1. 理解React中es6方法创建组件的this

    首发于:https://mingjiezhang.github.io/(转载请说明此出处). 在JavaScript中,this对象是运行时基于函数的执行环境(也就是上下文)绑定的. 从react中的 ...

  2. 【原】React中,map出来的元素添加事件无法使用

    在使用react中,经常用到react的map函数,用法和jquery里中的map一样,但是,如果你在每个map出来的元素中添加,你会发觉添加的事件无法关联, 比如,我们很多的评论,我需要在每个评论下 ...

  3. React中props.children和React.Children的区别

    在React中,当涉及组件嵌套,在父组件中使用props.children把所有子组件显示出来.如下: function ParentComponent(props){ return ( <di ...

  4. SSH 框架学习之初识Java中的Action、Dao、Service、Model-收藏

    SSH 框架学习之初识Java中的Action.Dao.Service.Model-----------------------------学到就要查,自己动手动脑!!!   基础知识目前不够,有感性 ...

  5. Immutable 详解及 React 中实践

    本文转自:https://github.com/camsong/blog/issues/3 Shared mutable state is the root of all evil(共享的可变状态是万 ...

  6. React中父组件与子组件之间的数据传递和标准化的思考

    React中父组件与子组件之间的数据传递的的实现大家都可以轻易做到,但对比很多人的实现方法,总是会有或多或少的差异.在一个团队中,这种实现的差异体现了每个人各自的理解的不同,但是反过来思考,一个团队用 ...

  7. React中使用CSSTransitionGroup插件实现轮播图

    动画效果,是一个页面上必不可少的功能,学习一个新的东西,当然就要学习,如何用新的东西,用它的方法去实现以前的东西啦.今天呢,我就在这里介绍一个试用react-addons-css-transition ...

  8. 在React中使用Redux

    这是Webpack+React系列配置过程记录的第六篇.其他内容请参考: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-rout ...

  9. React中的路由系统

    React中的路由系统 提起路由,首先想到的就是 ASPNET MVC 里面的路由系统--通过事先定义一组路由规则,程序运行时就能自动根据我们输入的URL来返回相对应的页面.前端中的路由与之类似,前端 ...

随机推荐

  1. 查看Ubuntu的版本

    方法一: cat /etc/issue 方法二: lsb_release -a

  2. PID736(rqnoj)

    题目描述 n个小伙伴(编号从 0 到 n-1)围坐一圈玩游戏.按照顺时针方向给 n个位置编号,从 0 到 n-1.最初,第 0 号小伙伴在第0号位置,第1号小伙伴在第1号位置,依此类推. 游戏规则如下 ...

  3. ubuntu下安装显卡驱动

    前言           以下内容是个人学习之后的感悟,转载请注明出处~ 作者的显卡是GT 730,现以NVIDIA-Linux-x86-384.69为例. 1.打开终端,先删除旧的驱动: sudo ...

  4. CSS3:nth-child()伪类选择器,Table表格奇偶数行定义样式

    转自爱设计 原文链接http://www.dangshopex.com/jishufenxiang/WEBkaifajishu/8653.html CSS3的强大,让人惊叹,人们在惊喜之余,又不得不为 ...

  5. 重温sql 设计的基本三大范式

    第一范式:确保每列的原子性. 如果每列(或者每个属性)都是不可再分的最小数据单元(也称为最小的原子单元),则满足第一范式. 例如:顾客表(姓名.编号.地址.……)其中"地址"列还可 ...

  6. lightoj1064 【DP求方案】

    题意: n个相同的骰子,问你掷出>=x点数的可能性: 思路: dp[i][j]代表前 i 个骰子掷出 j 点数的方案数; 然后Σdp[n][x]-dp[n][6*n]就好了 卧槽,一开始想的是拆 ...

  7. 51nod1212【最小生成树kruskal算法】

    思路: 利用破圈法. #include <bits/stdc++.h> using namespace std; typedef long long LL; const int N=1e3 ...

  8. [Xcode 实际操作]九、实用进阶-(2)遍历设备(输出系统)上的所有字体

    目录:[Swift]Xcode实际操作 在实际工作中,经常需要调整界面元素的字体种类. 本文将演示输出系统提供的所有字体,方便检索和使用. 在项目导航区,打开视图控制器的代码文件[ViewContro ...

  9. 【IDEA】关于 IDEA 中新建 web 项目的 webapp 文件夹没有小蓝点 ,启动服务,访问不到解决方案

    问题描述: 新建的 maven 的 Module 项目,webapp 文件夹也是在创建完项目后手动添加的,出现了 webapp 文件夹不能被识别的情况. 解决方案: 第一步:  选中项目按 F4 键, ...

  10. jvm 字节码查看

    javap -c -v HelloWorldDemo.class >HelloWorld.txt