一、shallowReactive
shallowReactive与reactive具有相同功能,区别在于shallowReactive只能响应浅层数据
<script>
import {shallowReactive} from 'vue'
export default {
setup(){
let preson=showllowReactive({
name:'张三',
age:18,
job:{
teacher:{
salary:1
}
}
})
return {
person
}
}
}
</script>
person的name和age可以做到响应式的变更数据,而job中teacher的salary数据无法进行响应式的检测。
二、shallowRef
shallowRef与ref具有相同功能,区别在于shallowRef无法对对象类型数据进行响应,对象类型的数据值为obj类型,而不是proxy类型。
<template>
<button @click='x={y==288}'>点击替换</button>
</template>
<script>
import {shallowRef} from 'vue'
export default {
setup(){
let x=shallowRef({
y:0
})
return {
x
}
}
}
</script>
x的y值无法响应式改变,可以对x的y值进行替换