Vue3响应式provide、inject传值

在父组件定义一个响应式的值 chat为要向子组件传递的值 updateChat为子组件修改chat的方法

代码语言：javascript复制

const chat = ref(null)
const updateChat = (item) => {
    console.log("重新拿到的值", item)
    chat.value = item
}
provide('chat', chat)
provide('updateChat', updateChat)

子组件修改

代码语言：javascript复制

const updateChat = inject('updateChat')
updateChat("修改后的值")

子组件监听inject变化

代码语言：javascript复制

const chat = inject('chat')
watch(() => chat, () => {
    console.log("inject", chat)
}, { deep: true })

chat 响应式

0 人点赞