useEffect和useMemo

每次点击=》状态发生改变会执行Example()函数,

useEffect会执行吗?只有数组里传了count才会执行,没有的话不会执行(但页面中的state还是响应式的,只是不会执行useEffect里面的内容)。

useEffect里所执行的大多都是副作用方法,操作dom,监听事件,请求数据等

import React, {useState, useEffect} from 'react';function Example() {const [count, setCount] = useState(0);console.log('ooo')// 使用 effect 获取数据或进行副作用操作useEffect(() => {console.log('Data fetching or side effect');document.title = `You clicked ${count} times`;}, [count]); // 当 count 变化时重新执行return (<div><p>You clicked {count}times</p><button onClick={() => setCount(count + 1)}>Click me</button></div>);
}

useMemo的侧重点在缓存昂贵的计算,这点很像computed用法,如果不指定依赖,就不会执行,此时定义的sum也变成了响应式的了

import React, {useMemo, useState, useEffect} from "react";
function Example() {const [a, setA] = useState(0);const [b, setB] = useState(0);const [c, setC] = useState(0);const sum = useMemo(() => {for (let i = 0; i < 1000000; i++) {Math.sqrt(i);}console.log("Sum computed!");return a + b;}, [a, b]);console.log(sum);return (<div><div><button onClick={() => setA(a + 1)}>Increment A</button><button onClick={() => setB(b + 1)}>Increment B</button><button onClick={() => {setC(c + 1)}}>C Increment</button></div><div>Sum: {sum}</div></div>);
}
export default Example;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/183151.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

深度学习框架:Pytorch与Keras的区别与使用方法

☁️主页 Nowl &#x1f525;专栏《机器学习实战》 《机器学习》 &#x1f4d1;君子坐而论道&#xff0c;少年起而行之 文章目录 Pytorch与Keras介绍 Pytorch 模型定义 模型编译 模型训练 输入格式 完整代码 Keras 模型定义 模型编译 模型训练 输入格式 完整代…

渗透测试考核(靶机1)

信息收集 主机发现 nbtscan -r 172.16.17.0/24 发现在局域网内&#xff0c;有两台主机名字比较可疑&#xff0c;177和134&#xff0c;猜测其为目标主机&#xff0c;其余的应该是局域网内的其他用户&#xff0c;因为其主机名字比较显眼&#xff0c;有姓名的拼音和笔记本电脑的…

【Python】SqlmapAPI调用实现自动化SQL注入安全检测

文章目录 简单使用优化 应用案例&#xff1a;前期通过信息收集拿到大量的URL地址&#xff0c;这个时候可以配置sqlmapAP接口进行批量的SQL注入检测 &#xff08;SRC挖掘&#xff09; 查看sqlmapapi使用方法 python sqlmapapi.py -h启动sqlmapapi 的web服务&#xff1a; 任务流…

【论文笔记】SDCL: Self-Distillation Contrastive Learning for Chinese Spell Checking

文章目录 论文信息Abstract1. Introduction2. Methodology2.1 The Main Model2.2 Contrastive Loss2.3 Implementation Details(Hyperparameters) 3. Experiments代码实现个人总结值得借鉴的地方 论文信息 论文地址&#xff1a;https://arxiv.org/pdf/2210.17168.pdf Abstrac…

游戏APP接入哪些广告类型

当谈到游戏应用程序&#xff08;APP&#xff09;接入广告时&#xff0c;选择适合用户体验和盈利的广告类型至关重要。游戏开发者通常考虑以下几种广告类型&#xff1a; admaoyan猫眼聚合 横幅广告&#xff1a; 这些广告以横幅形式显示在游戏界面的顶部或底部。它们不会打断游戏…

idea doc 注释 插件及使用

开启rendered view https://blog.csdn.net/Leiyi_Ann/article/details/124145492 生成doc https://blog.csdn.net/qq_42581682/article/details/105018239 把注释加到类名旁边插件 https://blog.csdn.net/qq_30231473/article/details/128825306

解决QT信号在信号和槽连接前发出而导致槽函数未调用问题

1.使用QMetaObject::invokeMethod 当使用 QMetaObject::invokeMethod 将函数放入事件队列时&#xff0c;该函数会在适当时机被执行&#xff0c;然后被从事件队列中移除。 "适当时机" 指的是函数被安排在事件队列中&#xff0c;等待事件循环处理时机。这个时机取决于…

聚类分析例题 (多元统计分析期末复习)

例一 动态聚类&#xff0c;K-means法&#xff0c;随机选取凝聚点&#xff08;题目直接给出&#xff09; 已知5个样品的观测值为&#xff1a;1&#xff0c;4&#xff0c;5&#xff0c;7&#xff0c;11。试用K均值法分为两类(凝聚点分别取1&#xff0c;4与1&#xff0c;11) 解&…

找不到 sun.misc.BASE64Decoder ,sun.misc.BASE64Encoder 类

找不到 sun.misc.BASE64Decoder &#xff0c;sun.misc.BASE64Encoder 类 1. 现象 idea 引用报错 找不到对应的包 import sun.misc.BASE64Decoder; import sun.misc.BASE64Encoder;2. 原因 因为sun.misc.BASE64Decoder和sun.misc.BASE64Encoder是Java的内部API&#xff0c;通…

oracle java.sql.SQLException: Invalid column type: 1111

1.遇到的问题 org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.type.TypeException: Could not set parameters for mapping: ParameterMapping{propertyuuid, modeIN, javaTypeclass java.lang.String, jdbcTypenull, numericScalenull, r…

VR虚拟教育展厅,为教学领域开启创新之路

线上虚拟展厅是一项全新的展示技术&#xff0c;可以为参展者带来不一样的观展体验。传统的实体展览存在着空间限制、时间限制以及高昂的成本&#xff0c;因此对于教育领域来说&#xff0c;线上虚拟教育展厅的出现&#xff0c;可以对传统教育方式带来改革&#xff0c;凭借强大的…

An illegal reflective access operation has occurred问题记录

报错 2023-11-30T01:08:18.7440800 [ERROR] [system.err] WARNING: An illegal reflective access operation has occurred 2023-11-30T01:08:18.7450800 [ERROR] [system.err] WARNING: Illegal reflective access by com.intellij.ui.JreHiDpiUtil to method sun.java2d.Sun…

ORA-00837: Specified value of MEMORY_TARGET greater than MEMORY_MAX_TARGET

有个11g rac环境&#xff0c;停电维护后&#xff0c;orcl1正常启动了&#xff0c;orcl2启动报错如下 SQL*Plus: Release 11.2.0.4.0 Production on Wed Nov 29 14:04:21 2023 Copyright (c) 1982, 2013, Oracle. All rights reserved. Connected to an idle instance. SYS…

1091 Acute Stroke (三维搜索)

题目可能看起来很难的样子&#xff0c;但是看懂了其实挺简单的。&#xff08;众所周知&#xff0c;pat考察英文水平&#xff09; 题目意思大概是&#xff1a;给你一个L*M*N的01长方体&#xff0c;求全为1的连通块的总体积大小。&#xff08;连通块体积大于T才计算在内&#xf…

从0开始学习JavaScript--JavaScript 模板字符串的全面应用

JavaScript 模板字符串是 ES6 引入的一项强大特性&#xff0c;它提供了一种更优雅、更灵活的字符串拼接方式。在本文中&#xff0c;将深入探讨模板字符串的基本语法、高级用法以及在实际项目中的广泛应用&#xff0c;通过丰富的示例代码带你领略模板字符串的魅力。 模板字符串…

亚马逊云科技基于 Polygon 推出首款 Amazon Managed Blockchain Access,助 Web3 开发人员降低区块链节点运行成本

2023 年 11 月 26 日&#xff0c;亚马逊 (Amazon) 旗下 Amazon Web Services&#xff08;Amazon&#xff09;在其官方博客上宣布&#xff0c;Amazon Managed Blockchain (AMB) Access 已支持 Polygon Proof-of-Stake(POS) 网络&#xff0c;并将满足各种场景的需求&#xff0c;包…

vueRouter常用属性

vueRouter常用属性 basemodehashhistoryhistory模式下可能会遇到的问题及解决方案 routesprops配置(最佳方案) scrollBehavior base 基本的路由请求的路径 如果整个单页应用服务在 /app/ 下&#xff0c;然后 base 就应该设为 “/app/”,所有的请求都会在url之后加上/app/ new …

删除list中除最后一个之外所有的数据

1.你可以新建一个list List<Integer> listnew ArrayList<>();int i0;while (i<100){list.add(i);}List<Integer> subList list.subList(list.size()-1, list.size());System.out.println("原list大小--"list.size());System.out.println("…

el-table根据返回数据回显选择复选框

接口给你返回一个集合&#xff0c;然后如果这个集合里面的status2&#xff0c;就把这一行的复选框给选中 注意&#xff1a; 绑定的ref :row-key"getRowKeys" this.$refs.multiTableInst.toggleRowSelection(this.list[i], true); <el-table :data"list"…

群晖安装portainer

一、下载镜像 打开【Container Manager】 ,搜索portainer&#xff0c;双击【6053537/portainer-ce】下载汉化版本 二、创建映射文件夹 打开【File Station】&#xff0c;在docker目录下创建【portainer】文件夹 三、开启SSH 群晖 - 【控制面板】-【终端机和SNMP】 勾选【启动…