//状态不要直接修改,比如:

// 错的,这样写不会重新渲染组件
this.state.comment = 'Hello'; //修改状态正确的方式
this.setState({comment:'Hello'}); setState方法的参数可以接受一个对象,也可以接受一个回调函数,状态的修改可能是异步的,所以当你修改的状态需要依赖状态本身或者props的值的时候,不要用上面的方式,而是传递一个方法,比如: //假如组件有这样一个状态 this.state = {count:0};
this.setState((prevState,props) =>({count:prevState.count + props.num})) //当setState的参数是回调函数的时候,它接受两个参数,第一个是组件的上一个状态对象,第二个是组件的props对象 //组件可以将状态作为属性传递给子组件
<Demo message={this.state.comment} /> //状态只能定义在construtor构造函数里面

react学习笔记2之正确使用状态的更多相关文章

  1. React学习笔记(一)- 入门笔记

    React入门指南 作者:狐狸家的鱼 本文链接:React学习笔记 GitHub:sueRimn 1.组件内部状态state的修改 修改组件的每个状态,组件的render()方法都会再次运行.这样就可 ...

  2. React学习笔记(五)State&声明周期

    React学习笔记(五) 四.State&声明周期 可以为组件添加"状态(state)".状态与属性相似,但是状态是私有的,完全受控于当前组件. 局部状态就是只能用于类(定 ...

  3. react学习笔记1--基础知识

    什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...

  4. React学习笔记(七)条件渲染

    React学习笔记(七) 六.条件渲染 使用if或条件运算符来创建表示当前状态的元素. 可以使用变量来存储元素.比如: let button = null; if (isLoggedIn) { but ...

  5. React学习笔记--程序调试

    React学习笔记 二 程序调试   前面我们搭建好了React的基本开发环境,可以编写基本的React js程序了.但完成的开发环境肯定包含调试器,怎么调试用React编写的JS程序呢?有浏览器,比 ...

  6. React学习笔记(六)事件处理

    React学习笔记(六) 五.事件处理 React事件绑定属性的命名采用驼峰写法,不同于传统DOM全部小写. 如果采用JSX的语法,事件函数需要用大括号{}包裹函数名,不同于传统DOM字符串小括号的方 ...

  7. React学习笔记 - 组件&Props

    React Learn Note 4 React学习笔记(四) 标签(空格分隔): React JavaScript 三.组件&Props 组件可以将UI切分成一些独立的.可复用的部件,这样你 ...

  8. React学习笔记 - 元素渲染

    React Learn Note 3 React学习笔记(三) 标签(空格分隔): React JavaScript 二.元素渲染 元素是构成react应用的最小单位. 元素是普通的对象. 元素是构成 ...

  9. React学习笔记 - JSX简介

    React Learn Note 2 React学习笔记(二) 标签(空格分隔): React JavaScript 一.JSX简介 像const element = <h1>Hello ...

随机推荐

  1. 机器学习系列-tensorflow-01-急切执行API

    tensorflow急切执行概述 Eager execution is an imperative, define-by-run interface where operations are exec ...

  2. 原生CSS设置网站主题色—CSS变量赋值

    定义CSS变量 在css文件顶部定义css变量,注意必须以--开头,使用:root包括这几个变量 :root { --main-bg-color: #ff7675; --color1: #fbfee9 ...

  3. C语言基础二(敲打键盘、寻找资料)

    看过很多资料的人,估计发觉了什么,我上篇的基础一其中一个最致命的错误,没有加return 0; 为什么不加,说真的,我留个坑,所以跳跃性的直接说到函数是如何运用的. 上章说到main就是主入口,根据m ...

  4. VueJs初步学习,一个表格的增删改查

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. EasyAR 开发实例---AR礼物(简单demo)

    一个节日礼物效果 --显示模型 在本次的案例中,我使用的是unity5.6.3版本,EasyAR 为2.0.(用1.0的版本,在渲染那块有问题) [导入SDK]到EasyAR官网(http://www ...

  6. Oracle数据库访问其他用户下的表,不加表所属的用户名的实现方法

    一. 问题: 如何实现在Oracle数据库中访问其他用户的表时不需加表所属的用户名 二. 举例: Oracle里面的用户A,要访问用户B的表需要带用户B的前缀,如访问用户B的 TEST表,需要这样访问 ...

  7. [Java代码] Java用pinyin4j根据汉语获取各种格式和需求的拼音

    pinyin4j是一个功能强悍的汉语拼音工具包,主要是从汉语获取各种格式和需求的拼音,功能强悍,下面看看如何使用pinyin4j.下面介绍用pinyin4j来做的一个根据汉语获取各种格式和需求的拼音d ...

  8. oracle--Tracing PL/SQL subprogram calls with parameters values--Mahmoud Hatem,

    https://mahmoudhatem.wordpress.com/2017/09/15/geeky-plsql-tracerprofiler-first-step/ https://mahmoud ...

  9. VBA 判断一个TXT编码方式,再创建一个新的文件,复制数据进去

    如题,先读取一个文本文件判断编码(Unicode  ANSI),就这两种编码然后将txt导入到excel表中,最后处理完成,再创建一个相同编码,不同文件名的txt文件,把新数据放进去 Sub test ...

  10. Java全栈程序员之06:IDEA中MAVEN项目依赖及运行

    MAVEN已经成为事实上的企业项目开发中的项目类型.无论是IDEA还是Eclipse,都已经默认支持创建MAVEN项目.严格意义上来说,MAVEN不是一种新的JavaEE项目类型.它凌驾于所以的项目类 ...