广州网站定做教程,做视频网站需要哪些证,哈尔滨建设部网站,wordpress如何修改评论文章目录 ref()reactive()ref对比reactivetoRefs与toRef ref() 作用#xff1a;定义响应式变量。 语法#xff1a;let xxxref(初始值)。 返回值#xff1a;一个RefImpl的实例对象#xff0c;简称ref对象或ref#xff0c;ref对象的value属性是响应式的 注意点#xff1… 文章目录 ref()reactive()ref对比reactivetoRefs与toRef ref() 作用定义响应式变量。 语法let xxxref(初始值)。 返回值一个RefImpl的实例对象简称ref对象或refref对象的value属性是响应式的 注意点 JS中操作数据需要xxx.value但模板中不需要.value直接使用即可。对于let name ref(‘张三’)来说name不是响应式的name.value是响应式的
reactive() 作用定义响应式对象基本类型不要用它要用ref否则报错。 语法let 响应式对象reactive(源对象)。 返回值一个Proxy的实例对象简称响应式对象。 注意点reactive定义的响应式数据是“深层次”的。
ref对比reactive
宏观角度看: ref用来定义基本类型数据、对象类型数据;reactive用来定义对象类型数据。 区别: ref 创建的变量必须使用value可以使用volar插件自动添加value。reactive 重新分配一个新对象会失去响应式可以使用0bject.assign去整体替换。 使用原则: 若需要一个基本类型的响应式数据必须使用ref。若需要一个响应式对象层级不深ref、reactive都可以。若需要一个响应式对象且层级较深推荐使用reactive。
toRefs与toRef
作用将一个响应式对象中的每一个属性转换为ref对象。 备注toRefs与toRef功能一致但toRefs可以批量转换。 语法如下
import {reactive,toRefs,toRef} from
// 数据
let person reactive({name:张三age:18
})
let {name,age} toRefs(person)
let nl toRef(person,age)
