vue3中ref,toref和torefs比较

一:ref是将基本类型数据变成响应式数据`

const name = ref("张三")

此时,name就变成了响应式,修改ref里面的值需要.value才可以
在这里插入图片描述在这里插入图片描述
此时打印出name,可以看出是一个refImpl类型,通过.value属性可以读到name的值
ref只是做了拷贝,修改数据,视图会发生变化,但是元数据不会改变
二:toref,将对象中某一个属性变成响应式,传递2个参数,第一个对象名,第二个对象属性
三:toRefs用来把响应式对象转换成普通对象,把对象中的每一个属性,包裹成ref对象

setup语法糖中使用torefs,最终目前只能这样抛出

const {name,hobby} = toRefs(man)

四:ref、toRef、toRefs 都可以将某个对象中的属性变成响应式数据

ref的本质是拷贝,修改响应式数据,不会影响到原始数据,视图会更新

toRef、toRefs的本质是引用,修改响应式数据,会影响到原始数据,视图会更新

toRef 一次仅能设置一个数据,接收两个参数,第一个参数是哪个对象,第二个参数是对象的哪个属性

toRefs接收一个对象作为参数,它会遍历对象身上的所有属性,然后挨个调用toRef执行

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值