在vue3中,有两个重要的api分别是ref 和reactive
使用方法如下
import { reactive, ref } from 'vue';
setup(){
let student = reactive({
name: "zhangsan",
age: 18
})
let count = ref(0);
return {
count,
student
}
}
基本数据类型使用ref对象创建响应式,复杂数据类型使用reactive创建响应式,
在js文件中操作ref对象创建的值需要使用 .value 在模板中则可以直接使用,因为在模板中会自动添加.value
其实ref对象也可以传入一个复杂数据类型,当传入一个复杂数据类型时在内部会自动将.value的值转换为一个reactive对象,如下
let a = {
name: "zhangsan",
age: 18
}
let student = reactive(a)
let refStudent = ref(a)
//student=== refStudent.value ==> true