shallowReactive只能修改reactive中浅层次的数据
格式只能修改xxx.xxx = '555'
不能修改 xxx.xxx.xxx = ''
<template><div>{{ sum }}{{ person }}<button @click="ssum">修改sum</button><button @click="sperson">修改name</button><button @click="spage">修改age</button><button @click="carcar1">修改车</button><button @click="spep">修改整个人</button></div>
</template><script setup lang="ts" name="App">
import {ref,shallowRef,reactive,shallowReactive} from 'vue'
let sum = ref(0)
let person = shallowReactive({name:'小米',age:200,car:{car1:'奔驰'}
})
function ssum(){sum.value =+1
}
function sperson(){person.name = '张三'
}
function spage(){person.age = 111
}
function spep(){Object.assign(person,{name:'李四',age:222,car:{car:'奥迪'}})
// person = {
// name:'里斯',
// age:2100,
// car:{
// car1:'奔驰111'
// }
// }}
function carcar1(){person.car.car1 = '奥迪'
}
</script><style>.wraper .title {padding: 20px;text-align: center;min-width: 610px;}.wraper .small{font-size: 15px;}.wraper .list-group-item {min-width: 230px;}
</style>
)
