React 常用的扩展知识点

setState 更新状态时异步的。而且他每次更新都会重新渲染数据。 即便是给setState({})传入空对象。还是会触发数据更新 --> dom 更新

React 状态更新函数setState 的两种方式

注意callback回调函数是可选的,他在状态更新完毕后,render 渲染后 才来调用callback函数

  • 对象方式的setState
setState({name: 'example'}, () => {
  console.log()
})
  • 函数方式的setState
    update更新函数会接收到state,和props
setState((state,props) => {
  state.name = 'fnUpdate';
}, () => {
  console.log('do something')
})

两者间的区别
对象类型的setState 是函数setState的简写或者是语法糖
区别:
1、如果新状态不依赖于旧状态 =====> 使用对方方式
2、如果新状态依赖于原状态 =======> 使用函数方式
3、如果想在状态更新后(setState)获取到最新的状态数据,则要在callback回调函数里面获取

相关文章

一、前言 在组件方面react和Vue一样的,核心思想玩的就是组件...
前言: 前段时间学习完react后,刚好就接到公司一个react项目...
前言: 最近收到组长通知我们项目组后面新开的项目准备统一技...
react 中的高阶组件主要是对于 hooks 之前的类组件来说的,如...
我们上一节了解了组件的更新机制,但是只是停留在表层上,例...
我们上一节了解了 react 的虚拟 dom 的格式,如何把虚拟 dom...