博客
关于我
hook钩子介绍
阅读量:304 次
发布时间:2019-03-03

本文共 778 字,大约阅读时间需要 2 分钟。

useEffect不带第二个参数

useEffect类似于React的生命周期方法,用于在组件加载和更新时执行代码。在React中,useEffect默认接受一个函数作为回调,执行时会在组件的挂载和更新时被调用。如果需要在特定条件下执行回调,可以传递依赖数组作为第二个参数。但有时候,我们并不需要依赖数组,直接传递一个函数即可。

例如:

useEffect(() => {// 更新文档标题document.title = 你点击了${count}次;});

这样写法在组件第一次加载和每次状态更新时都会被执行。

示例:

import React, { useState, useEffect } from 'react';import { Button } from '@alifd/next';

export default function Example() {const [count, setCount] = useState(0);

useEffect(() => {    console.log(`hook-----${new Date()}`);    console.log(`次数 ${count}`);    document.title = `你点击了${count}次`;});return (    

你点击了 {count} 次

);

}

第一次加载时,控制台会打印:

hook-----[当前日期时间]次数 0

每次点击按钮"Click me",控制台会打印:

hook-----[当前日期时间]次数 [当前计数值]

这个方法适用于在组件加载和更新时执行一次性操作,比如设置页面标题、执行初始数据加载等。

转载地址:http://euvm.baihongyu.com/

你可能感兴趣的文章
Opencv中KNN背景分割器
查看>>
OpenCV中基于已知相机方向的透视变形
查看>>
OpenCV中的监督学习
查看>>
opencv中读写视频
查看>>
opencv之cv2.findContours和drawContours(python)
查看>>
opencv之namedWindow,imshow出现两个窗口
查看>>
opencv之模糊处理
查看>>
Opencv介绍及opencv3.0在 vs2010上的配置
查看>>
OpenCV使用霍夫变换检测图像中的形状
查看>>
opencv保存图片路径包含中文乱码解决方案
查看>>
OpenCV保证输入图像为三通道
查看>>
OpenCV入门教程(非常详细)从零基础入门到精通,看完这一篇就够了
查看>>
opencv图像分割2-GMM
查看>>
opencv图像分割3-分水岭方法
查看>>
opencv图像切割1-KMeans方法
查看>>
OpenCV图像处理篇之阈值操作函数
查看>>
opencv图像特征融合-seamlessClone
查看>>
OpenCV图像的深浅拷贝
查看>>
OpenCV学习(13) 细化算法(1)(转)
查看>>
OpenCV学习笔记(27)KAZE 算法原理与源码分析(一)非线性扩散滤波
查看>>