栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

如何在React Hooks中使用componentWillMount()?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

如何在React Hooks中使用componentWillMount()?

你不能使用任何现有的生命周期方法(

componentDidMount
componentDidUpdate
componentWillUnmount
在钩等)。它们只能在类组件中使用。并且使用挂钩,您只能在功能组件中使用。下面的行来自React文档:

如果你熟悉阵营类生命周期方法,你能想到的

useEffect
钩。因为
componentDidMount
componentDidUpdate
componentWillUnmount
结合。

建议是,您可以从功能组件中的类组件模仿这些生命周期方法。

componentDidMount
安装组件时,内部代码运行一次。
useEffect
钩子等效于此行为是

useEffect(() => {  // Your pre here}, []);

注意这里的第二个参数(空数组)。这将只运行一次。

如果没有第二个参数

useEffect
则会在每次渲染组件时调用该钩子,这很危险。

useEffect(() => {  // Your pre here});

componentWillUnmount
用于清理(例如删除事件侦听器,取消计时器等)。假设您要在其中添加事件监听器,
componentDidMount
并按
componentWillUnmount
如下所示将其删除。

componentDidMount() {  window.addEventListener('mousemove', () => {})}componentWillUnmount() {  window.removeEventListener('mousemove', () => {})}

相当于上述代码的钩子如下

useEffect(() => {  window.addEventListener('mousemove', () => {});  // returned function will be called on component unmount   return () => {    window.removeEventListener('mousemove', () => {})  }}, [])


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/649741.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号