Vue toRef、toRefs、toRaw 基础使用

一、参考

学习Vue3 第八章(认识to系列全家桶)_vue3 去掉 expects a reactive object but received a p-CSDN博客

二、toRef

2.1 作用

将响应式对象中的属性解构出来

注意: 要解构的对象需要为响应式对象

2.2 演示

toRef 需要输入两个参数

第一个为要解构的对象,第二个为结构的属性

注意:若对解构后的对象重新赋值,将会影响原对象

三、toRefs

3.1 作用

批量解构

3.2 演示

四、toRaw

4.1 作用

响应式对象解构为普通对象

4.2 演示

相关推荐
an3174222 分钟前
弹窗数据流设计的两种高阶架构实践
前端·vue.js·架构
谢尔登37 分钟前
【React】 状态管理方案
前端·react.js·前端框架
用户2136610035721 小时前
Vue商品详情与放大镜组件
前端·javascript
半个落月1 小时前
从Tapas小Demo理清localStorage、事件与this
前端·javascript
李明卫杭州1 小时前
Vue2 中 v-model 处理不同数据结构的技巧
前端·javascript·vue.js
李明卫杭州1 小时前
使用 computed 处理 v-model 复杂数据结构
前端·javascript·vue.js
丨我是张先生丨1 小时前
日语单词 Web Page
前端·css·css3
禅思院3 小时前
AI对话前端从入门到崩溃:一个长对话引发的五层优化战争【引子】
前端·面试·架构
TrisighT4 小时前
Electron 鸿蒙 PC 上点外链唤醒应用,我试了 6 种写法只有 1 种能跑
前端·electron·harmonyos
2501_930707784 小时前
如何将HTML文件转换为纯文本(详细步骤指南)
前端·html