vue里export default

export default是Vue中一个重要的概念。它是用来导出模块中的默认成员的形式之一。在Vue中，我们可以在组件中使用export default导出组件选项对象。这些选项对象可以包含组件的模板、数据、组件生命周期钩子函数、事件方法等。通过Vue的模板编译器，我们可以将组件的选项对象编译成渲染函数，从而渲染出组件的界面。

在Vue中，我们可以使用单文件组件来组织我们的代码。单文件组件是一个拓展名为.vue的文件，它可以包含模板、样式和脚本等。在单文件组件中，我们可以将组件选项对象使用export default导出。

export default {
  template: `
    <div>
      <p>{{ message }}</p>
      <button @click="onClick">Click me!</button>
    </div>
  `,data() {
    return {
      message: 'Hello,World!'
    }
  },methods: {
    onClick() {
      alert('Button clicked!');
    }
  }
}

在上面的例子中，我们定义了一个简单的组件。它包含了一个模板、一个data选项和一个methods选项。该组件通过export default导出。

当我们在应用程序中使用这个单文件组件时，我们可以使用import语句导入该组件的模块，并使用它构建我们的Vue应用。

import MyComponent from './MyComponent.vue';

new Vue({
  el: '#app',components: { MyComponent }
});

在上面的代码中，我们通过import语句引入了MyComponent.vue这个单文件组件的模块。然后，我们在Vue实例的components选项中注册这个组件。最后，我们将Vue实例挂载到id为'app'的DOM元素上。

除了在单文件组件中定义组件选项对象并使用export default导出之外，我们还可以在脚本中使用export default导出普通对象、函数和类等。

// 导出一个普通的对象
export default {
  foo: 'bar',baz: 42
}

// 导出一个函数
export default function(x,y) {
  return x + y;
}

// 导出一个类
export default class {
  constructor() {
    this.name = 'MyClass';
  }
}

以上就是关于Vue里export default的详细解释。export default是Vue中一个非常重要的概念，它可以在单文件组件中使用，也可以在脚本中使用。通过export default，我们可以将一个模块中的默认成员导出，并在其他模块中使用它们。