博客
关于我
hook钩子介绍
阅读量:305 次
发布时间: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/

你可能感兴趣的文章
Qt知识:视图框架QGraphicsWidget详解
查看>>
SpringBoot中项目启动及定时任务缓存数据库常用数据至内存变量并转换后高频调用
查看>>
Qt知识: 画刷风格
查看>>
QT的OpenGL渲染窗QOpenGLWidget Class
查看>>
QT的C++程序加载动态链接库DLL(Linux下是so)的方式
查看>>
QT界面操作1:如何跟踪鼠标位置?
查看>>
Qt环境搭建(Visual Studio)
查看>>
QT点击"X"按钮,调用closeEvent()函数来实现调用特定事件(附:粗略介绍QT的信号与槽的使用方法)...
查看>>
QT样式表——url路径
查看>>
QT数据库(三):QSqlQuery使用
查看>>
QT教程5:消息框
查看>>
SpringBoot中集成阿里开源缓存访问框架JetCache实现声明式实例和方法缓存
查看>>
pom.xml中提示web.xml is missing and <failonmissingw>...
查看>>
Pomelo开发中Web客户端开发API简介
查看>>
QT教程2:QT5的体系构架
查看>>
PON架构(全光网络)
查看>>
PoolingHttpClientConnectionManager原理剖析
查看>>
QT教程1:ubuntu18.04安装QT5
查看>>
POP-一个点击带有放大还原的动画效果
查看>>
POP3 协议在计算机网络中的优缺点
查看>>