博客
关于我
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/

你可能感兴趣的文章
PostgreSQL 分组聚合查询中 filter 子句替换 case when
查看>>
PostgreSQL 同步流复制锁瓶颈分析
查看>>
PostgreSQL 备份与还原命令 pg_dump
查看>>
Postgresql 外部表插件postgres_fdw的安装和使用
查看>>
PostgreSQL 如何从崩溃状态恢复(上)
查看>>
PostgreSQL 存储过程基本语法
查看>>
PostgreSQL 实现批量更新、删除、插入
查看>>
PostgreSQL 导入 .gz 备份文件
查看>>
PostgreSQL 批量插入&更新数据时报错(ERROR: ON CONFLICT DO UPDATE command cannot affect row a second time)
查看>>
PostgreSQL 新增数据返回自增ID
查看>>
postgresql 更新多列数据
查看>>
PostgreSQL 服务启动后停止
查看>>
PostgreSQL 辟谣存在任意代码执行漏洞:消息不实
查看>>
PostgreSQL+PostGIS实现两坐标点之间最短路径查询算法函数(地图工具篇.12)
查看>>
Qt开发——简易调色板QPalette
查看>>
PostgreSQL-解决连接时遇到的乱码问题
查看>>
PostgreSQL15.2最新版本安装_远程连接_Navicat操作_pgAdmin操作_Windows10上安装---PostgreSQL工作笔记001
查看>>
PostgreSQL9.1 双机部署配置(主备数据同步)
查看>>
Qt开发——简易网络浏览器(一)
查看>>
Qt开发——简易成绩登记系统
查看>>