Vue3
vue3响应式原理是基于es6中的Proxy实现的
将普通变量转变成响应式变量 通过ref修饰
通过ref修饰过的数据必须通过.value的方式获取
通过ref的方式获取dom ref(null)
获取当前实例
let _this=getCurrentInstance()
直接解构会失去数据的响应性 想用的话需要通过toRefs方法
通过toRefs将一个reactive响应式对象中的每一项转化成ref变量
通过toRef将一个reactive响应式对象中的某一项转化成ref变量
通过isRef方法判断是否是ref变量
通过isReactive方法判断对象是否是一个代理的reactive对象
reactive:将对象修改成响应式数据 只能修饰对象和数组
shallowRef:对于复杂层级的对象,只将第一层变成ref响应(性能优化)
triggerRef():强制更新
toRaw() :将reactive响应式对象转换成普通对象原始数据
同时他也可以实现深拷贝的功能,例如在输入金额时可以进行数据的转换(由元变分)
import { ref, computed } from 'vue';
let xing = ref('')
let ming = ref('')
// 计算属性的使用方式
let username = computed(() => {
return xing.value + ming.value
})

浙公网安备 33010602011771号