vue3 ref，shallowRef, triggerRef, customRef
ref深層次響應
變成響應式
const name = ref('refName')
name.value = 'newName'shallowRef淺層次響應
const obj = shallowRef({ name: 'shallowRefName' })
obj.value = { name: 'newName' } // 響應式
obj.value.name = 'newName' // 非響應式，視圖不刷新triggerRef主動觸發一次更新
const obj = shallowRef({ name: 'shallowRefName' })
obj.value = { name: 'newName' } // 響應式
obj.value.name = 'newName' // 非響應式，視圖不刷新
triggerRef(obj) // 重新觸發一次視圖刷新customRef自定義ref
function custom(value) {
return customRef((track, trigger) => {
return {
get() {
track()
return value
},
set(newVal) {
value = newVal
trigger()
}
}
})
}
// 返回一個ref對象
const name = custom('customRefName')
name.value = 'customNewRefName' // 觸發了set方法，視圖更新
