Vue toRef、toRefs、toRaw 基础使用

1,402 阅读1分钟

一、参考

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

二、toRef

2.1 作用

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

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

2.2 演示

toRef 需要输入两个参数

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

image.png

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

image.png

三、toRefs

3.1 作用

批量解构

3.2 演示

image.png

四、toRaw

4.1 作用

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

4.2 演示

image.png