Vue3中props被消除响应式V
1. 在子组件中引入props
<template>
<p>{ title }</p>
</template>
props: {
title: String
}
2. 在setup中使用:
setup (props) {
const { title } = reactive(props)
return { title }
}
注：此时如果父组件更新，但是title不会更新
问题原因： props是响应式的，使用es6解构赋值，消除了props的响应式
解决方案：
使用toRefs
setup (props) {
const { title } = toRefs(props)
console.log(title.value)
return { title }
}