zoukankan      html  css  js  c++  java
  • react关于setState的使用

    参考React官方文档,这里做下笔录

    (1)setState语法

    setState(updater, [callback])

    解析:
      参数一为带有形式参数的 updater 函数:
      参数二为可选的回调函数

      1、参数一介绍

      

      注意:当然,它不应直接被修改。你应该使用基于 state 和 props 构建的新对象来表示变化。例如,假设我们想根据 props.step 来增加 state:

      

      updater 函数中接收的 state 和 props 都保证为最新。updater 的返回值会与 state 进行浅合并

      

      

      所以我们一般在使用时会用其简洁语法

    简洁语法格式如下:
    this
    .setState({ counter })

      2、问题:参数一什么时候使用对象格式、什么时候使用函数格式?

      案例如下,两种形式实现累加效果

      

    对象方式是函数方式的简写方式
    如果新状态不依赖于原状态 ===> 使用对象方式
    如果新状态依赖于原状态 ===> 使用函数方式
    如果需要在setState()后获取最新的状态数据, 在第二个callback函数中读取

      关于依赖和不依赖,如下:

      

      

      3、参数二介绍

    setState() 的第二个参数为可选的回调函数,它将在 setState 完成合并并重新渲染组件后执行。
    通常,我们建议使用 componentDidUpdate() 来代替此方式。
    参数二:回调函数执行时机:状态更新且界面更新之后回调。

      

      

    .

  • 相关阅读:
    PyCharm专业版永久激活步骤详解(只是自己记一下以防后面需要)
    PV EV AC BAC EAC ETC等计算公式
    Linux服务器下安装Jmeter
    Python接口自动化测试运行成功但没有生成测试报告的总结
    Linux命令
    Python3+selenium环境配置
    selenium窗口切换问题
    Selenium安装问题
    Python爬虫功能(爬取网页图片)
    ASICC码对照表
  • 原文地址:https://www.cnblogs.com/fightjianxian/p/12629894.html
Copyright © 2011-2022 走看看