Vue学习笔记-Vue3中的shallowReactive和shallowRef

theLuckyLong2023-12-15 16:25

shallowReactive

  • 作用：与reactive作用类似，但只处理对象最外层属性的响应式（浅响应式）
  • 使用场景：如果有一个对象数据，结构比较深（内嵌多层对象），但只需要最外层的属性进行响应式，则使用shallowReactive

shallowRef

  • 作用：与ref作用类型，但只处理基本数据类型的响应式，不处理对象类的响应式
  • 使用场景：如果有一个对象数据，后续功能不会修改该对象中的属性，而是生成新的对象来替换，则使用shallowRef

心得

上述API函数主要用于性能优化

相关推荐
芭拉拉小魔仙5 小时前
企业级Vue项目的状态管理：从原理到实战架构
前端·vue.js·架构
扶苏10026 小时前
Vue 3 响应式原理深度解析
前端·javascript·vue.js
哆啦A梦158810 小时前
Vue3魔法手册 作者 张天禹 06_监控
前端·vue.js·typescript
扶苏100213 小时前
详解Vue3的自定义 Hooks
前端·javascript·vue.js
css趣多多16 小时前
Vue 响应式无限递归问题总结
前端·javascript·vue.js
014-code16 小时前
Vue3 性能优化实战
前端·vue.js·性能优化
css趣多多18 小时前
vue2项目改造为vue3遇到的问题以及解决办法
前端·vue.js·elementui
哆啦A梦158818 小时前
Vue3魔法手册 作者 张天禹 09_props的使用
前端·vue.js·typescript
哆啦A梦158818 小时前
Vue3魔法手册 作者 张天禹 11_自定义hooks
前端·vue.js·typescript
一叶星殇18 小时前
Windows 下用 Nginx 部署 Vue + .NET WebApi 全流程实战
vue.js·windows·nginx
热门推荐
01从零搭建一个 PHP 登录注册系统（含完整源码）02使用 1panel面板 部署 php网站03GitHub 镜像站点04PHP Error: 常见错误及其解决方法05Claude Code + GLM4.7 避坑指南：解决 Unable to connect to Anthropic services06AI Agent 平台横评：ZeroClaw vs OpenClaw vs Nanobot07如何将 TRAE IDE 的插件市场源切换至 VS Code 官方市场08全面体验 Grok API 中转站（2025 · Grok 4 系列最新版）09openClaw安装飞书插件｜核心踩坑：spawn EINVAL 错误终极解决指南10MIUI显示/隐藏5G开关的方法，信号弱时开启手机Wifi通话方法