useMemo的运用

原创于 2023-01-12 11:18:12 发布 · 98 阅读

·

0

·

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

useMemo是一个ReactHooks，主要用于缓存计算结果，避免在组件每次渲染时重复计算。只有当其依赖项变化时，才会重新计算并更新值，提高应用性能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

作用：
首先useMemo它使用来做缓存用的，只有当一个依赖项改变的时候才会发生变化，否则拿缓存的值，就不用在每次渲染的时候再做计算

在这里插入图片描述

pretty_c_a_t

博客等级

码龄13年

29
原创

7
点赞

12
收藏

14
粉丝

关注

私信

分类专栏

s

上一篇：: webpack 以及 git

最新评论

webpack
普通网友: 这篇文章是优质之作，内容充实，结构明晰，语言流畅且通俗易懂，适合广大读者阅读。【我也写了一些相关领域的文章，希望能够得到博主的指导，共同进步！】
webpack相关
pretty_c_a_t: 在入口文件：import { hot } from 'react-hot-loader/root'; export default hot(App); 在你的入口文件（通常是 src/index.js）中，添加以下代码以启用HMR： if (module.hot) { module.hot.accept(); } 启动开发服务器。在终端中运行以下命令以启动Webpack的开发服务器： npx webpack serve --open
webpack相关
pretty_c_a_t: 在入口文件：import { hot } from 'react-hot-loader/root'; export default hot(App); 在你的入口文件（通常是 src/index.js）中，添加以下代码以启用HMR： if (module.hot) { module.hot.accept(); } 启动开发服务器。在终端中运行以下命令以启动Webpack的开发服务器： npx webpack serve --open
webpack相关
pretty_c_a_t: 要配置Webpack以启用热模块替换（HMR），你需要做以下几步 npm install webpack-dev-server --save-dev[code=javascript]const path = require('path'); module.exports = { entry: './src/index.js', output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist') }, devServer: { contentBase: './dist', // 指定服务的根目录 hot: true // 启用热模块替换 } }; [/code]
webpack相关
pretty_c_a_t: module.exports = { entry: './src/index.js', output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist') }, module: { rules: [ { test: /\.css$/, use: [ 'style-loader', // 将 CSS 注入到 DOM 中 'css-loader', // 解析 CSS 文件，处理 CSS 中的 `@import` 和 `url()` 'postcss-loader', // 使用 PostCSS 对 CSS 进行一些预处理 'sass-loader' // 将 Sass 编译为 CSS ] } ] } };