Vue3 通过 props 传值被消除响应性
Vue3 通过 props 传值被消除响应性
1. 子组件中使用 props
{{ resourceType }}
此时页面上一直显示 /， 即便父组件传入的 detail 更新，resourceType 不会更新，说明它不是响应式的。
-
解决：使用
toRefs以及解构赋值语法。
setup(props){
const { detail } = toRefs(props)
const resourceType = computed(() => detail.value.resourceData || '/')
return { resourceType }
}