Reactive: 返回对象的响应式副本

toRefs: 将响应式对象转为普通对象,并使对象的property指向原始对象的property的ref

Const state = reactive({ count: 0 })

Const onClick = () => { state.count++ }

Return { …toRefs(state) }

Use: state

基本数据类型和引用类型都有效

Ref: 返回响应式对象,ref对象的value指向内部值

Const count = ref(1)

Const onClick = () => { count.value++ }

Return { count }

Use: count

Const count = ref({ a: 1 })

Const onClick = () => { count.value.a++ }

Return { count }

Use: count

Watch

reactive

const state = reactive({
searchFields: {
activeTab: 0,
currentDate: null,
type: 0,
todoType: 0
},
aa: 1
})

watch(() => state.searchFields, getTodoList, { deep: true })
watch(() => state.aa, (aa, prevAa) => {
console.log(‘aa, prevAa: ‘, aa, prevAa)
})

Ref

const bb = ref(0)
watch(bb, (aa, prevAa) => {
console.log(‘aa, prevAa: ‘, aa, prevAa)
})