用单元测试读懂 vue3 中的 defineComponent

在 Vue 3 的 Composition API 中，采用了 setup() 作为组件的入口函数。

在结合了 TypeScript 的情况下，传统的 Vue.extend 等定义方法无法对此类组件给出正确的参数类型推断，这就需要引入 defineComponent() 组件包装函数，其在 rfc 文档中的说明为：

https://composition-api.vuejs.org/api.html#setup

VI. 全文总结
引入 defineComponent() 以正确推断 setup() 组件的参数类型

defineComponent 可以正确适配无 props、数组 props 等形式

defineComponent 可以接受显式的自定义 props 接口或从属性验证对象中自动推断

在 tsx 中，element-ui 等全局注册的组件依然要用 kebab-case 形式

在 tsx 中，v-model 要用 model={{ value, callback }} 写法

在 tsx 中，scoped slots 要用 scopedSlots={{ foo: (scope) => (<Bar/>) }} 写法

defineComponent 并不适用于函数式组件，应使用 RenderContext<interface> 解决
————————————————
版权声明：本文为CSDN博主「tonylua」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/tonylua/article/details/109213452