export default用法vue_vue全家桶开发的一些小技巧和注意事项

export default 是 ES6 中一个方便的导出模块的语法，它可用于导出一个默认的模块成员。在 Vue 开发中，我们通常使用它来导出一个默认的组件对象或一个默认的插件对象。

下面是一些使用 export default 的小技巧和注意事项：

1. 导出单个组件

在一个组件文件中，我们可以使用 export default 导出一个默认的组件对象。例如：

<template>
  <div>Hello World!</div>
</template>

<script>
export default {
  name: 'MyComponent'
}
</script>

2. 导出多个组件

如果一个文件中有多个组件，我们可以使用对象字面量的方式将它们一起导出。例如：

<template>
  <div>Hello World!</div>
</template>

<script>
const Component1 = {
  name: 'Component1'
}

const Component2 = {
  name: 'Component2'
}

export default {
  Component1,
  Component2
}
</script>

3. 导出插件

在 Vue 中，我们也可以使用 export default 导出一个默认的插件对象。例如：

export default {
  install(Vue, options) {
    // ...
  }
}

4. 导入组件或插件

在导入一个使用了 export default 导出的组件或插件时，我们可以使用下面的语法：

import MyComponent from './MyComponent.vue'
import MyPlugin from './MyPlugin.js'

需要注意的是，这里的变量名 MyComponent 和 MyPlugin 可以根据需要自行命名，但是它们必须与导出的默认成员的名称相同。

总之，使用 export default 可以方便地导出默认的组件或插件对象，同时也可以将多个组件一起导出。在导入时，我们可以使用简洁的语法引入它们。