Vue3 - defineComponent解决了什么？

最新推荐文章于 2024-02-23 16:07:27 发布

hsany330

最新推荐文章于 2024-02-23 16:07:27 发布

阅读量1.6k

点赞数

文章标签： typescript javascript p2p

版权

defineComponent函数，只是对setup函数进行封装，返回options的对象；

export function defineComponent(options: unknown) {
  return isFunction(options) ? { setup: options } : options
}

defineComponent最重要的是：在TypeScript下，给予了组件正确的参数类型推断。

全文总结
引入 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博主「MINO吖」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_36157085/article/details/109498473

关注