vue3新增了響應(yīng)性API股囊，其中數(shù)據(jù)有兩種潮饱，ref和reactive蝉衣。
reactive支持非原始對象括尸，基礎(chǔ)類型不能使用（Number,Boolean等）
例1
const obj = reactive({ count: 0 })
obj.count++
console.log(obj.count) // 1
const obj = reactive([])
obj.push(1)
console.log(obj) // [1]
注意：使用
let定義后不能直接重新賦值reactive對象，會導(dǎo)致響應(yīng)式的代理被覆蓋病毡。
例2
export default {
name: 'App',
setup() {
let obj = reactive({a:1})
// 不能這么寫濒翻，這樣重新賦值后會，obj會變成普通對象,失去響應(yīng)式的效果;
setTimeout(() => {
obj = {a:2,b:3}
}, 1000)
return {
obj
}
}
}
遇到這樣的情況啦膜，需要單獨賦值
例3
const obj = reactive({a:1})
setTimeout(() => {
obj.a = 2;
obj.b = 3;
}, 1000)
或者使用Object.assign
例4
export default {
name: 'App',
setup() {
const obj = reactive({a:1})
setTimeout(() => {
Object.assign(obj,{a:2, b:3})
}, 1000)
return {
obj
}
}
}
