时间戳

首页 > 解决方案 > 哪种方式更好地创建 vue 组件（导出默认 vs defineComponent vs new Vue）

vue.js - 哪种方式更好地创建 vue 组件（导出默认 vs defineComponent vs new Vue）

问题描述

最近学习了 Vue.js 之后，我对如何编写 vue 组件语法感到非常困惑，我一直在看 youtube 教程和文章，每个人都使用不同的方法。

就 vue 3 而言，我们应该使用 export default 创建组件还是 export default defineComponent 或 new Vue({

那么如何决定如何创建 App 组件及其其余子组件和页面等的正确方法..

希望我的问题足够清楚。

谢谢

标签： vue.jsvue-componentvuejs3

解决方案

如果您需要创建多个组件，我强烈建议您使用单文件组件(SFC)

在这里，您将一个新组件定义为（在<script>标签内）：

import { defineComponent } from 'vue'
export default defineComponent({
  // ...
})

（或者export default {}如果不使用 TypeScript）

对于主应用程序组件，您可以这样做：

import { createApp } from "vue";
const app = createApp(App)
app.mount('#app')

或者就像这样，如果您不需要使用 vue-router、Vuex 等扩展 Vue。

import { createApp } from "vue";
createApp(App).mount('#app')

推荐阅读