Vue3 中关于 defineProps 的一些 “糖”

const { foo, bar } = defineProps(['foo', 'bar'])

在思否刷到一个问题 🔗 Vue3: 响应式 props 解构得到的变量将不是响应式?也不会更新? 按照问题中引用的文档描述来说确实是不能够解构返回值的。但是问题主提供的两个例子又说明了实际情况下,defineProps() 的返回值是能够被解构的。

VueJS 的 <script setup> 文档 中关于 defineProps() 的部分也没有针对其返回值是否能够解构做出说明。
我在Vue3项目的开发过程中并没有考虑到过这个问题,一直都是通过 props.xx 的形式来使用的。一下子就命中了我的知识盲区,还是 Vue3 写的少了啊。

不过在问题主引用的文档开头有一个响应性语法糖被 移除 的提示,所以去看了一下提示中链接的 废弃原因

阅读全文