首页 > 其他分享 >react生命周期

react生命周期

时间:2023-02-27 11:22:16浏览次数:32  
标签:生命周期 value react 更新 useEffect 监听

componentDidMount/componentWillUnmount

useEffect(() => {
// 挂载后的操作
}, [])

useEffect(() => {
  // 添加事件监听
  return () => {
    // 取消事件监听
  }
}, [])

componentDidUpdate

useEffect(() => {
// 每次更新都会执行
})

useEffect(() => {
// 每次value更新时执行
}, [value])

标签:生命周期,value,react,更新,useEffect,监听
From: https://www.cnblogs.com/my-wl/p/17159037.html

相关文章

  • vue 生命周期
    生命周期钩子每个Vue组件实例在创建时都需要经历一系列的初始化步骤,比如设置好数据侦听,编译模板,挂载实例到DOM,以及在数据改变时更新DOM。在此过程中,它也会运行被称为......
  • react的jsx和React.createElement是什么关系?面试常问
    1、JSX在React17之前,我们写React代码的时候都会去引入React,并且自己的代码中没有用到,这是为什么呢?这是因为我们的JSX代码会被Babel编译为React.createElement,我们来......
  • 前端一面react面试题(持续更新中)
    React性能优化shouldCompoentUpdatepureComponent自带shouldCompoentUpdate的浅比较优化结合Immutable.js达到最优为什么useState要使用数组而不是对象useState......
  • React面试:谈谈虚拟DOM,Diff算法与Key机制
    1.虚拟dom原生的JSDOM操作非常消耗性能,而React把真实原生JSDOM转换成了JavaScript对象。这就是虚拟Dom(VirtualDom)每次数据更新后,重新计算虚拟Dom,并和上一次生成的虚拟......
  • 百度前端高频react面试题(持续更新中)
    说说你用react有什么坑点?1.JSX做表达式判断时候,需要强转为boolean类型如果不使用!!b进行强转数据类型,会在页面里面输出0。render(){constb=0;return<d......
  • 前端常考react面试题(持续更新中)
    reactdiff算法我们知道React会维护两个虚拟DOM,那么是如何来比较,如何来判断,做出最优的解呢?这就用到了diff算法diff算法的作用计算出VirtualDOM中真正变化的部分,并......
  • 社招前端常见react面试题(必备)
    解释React中render()的目的。每个React组件强制要求必须有一个render()。它返回一个React元素,是原生DOM组件的表示。如果需要渲染多个HTML元素,则必须将它们组......
  • React组件之间的通信方式总结(下)
    一、写一个时钟用react写一个每秒都可以更新一次的时钟importReactfrom'react'importReactDOMfrom'react-dom'functiontick(){letele=<h1>{ne......
  • React组件之间的通信方式总结(上)
    先来几个术语:官方我的说法对应代码ReactelementReact元素letelement=<span>A爆了</span>Component组件classAppextendsReact.Component{}无Ap......
  • bean生命周期
    1、bean对象privateStringname;publicStringgetName(){returnname;}publicvoidsetName(Stringname){System.out.printl......