如何从.vue文件导出多个对象

时间:2018-09-26 21:40:14

标签: javascript typescript vue.js vuejs2 es6-modules

我在Vue中使用typescript。对于这个特定的用例,我想从我的.vue文件中导出多个项目。像这样:

// FooBar.vue

<template>
    ...
</template>

export class Foo extends Vue {
    foo: string = "foo";
}

export const Bar = {bar: "bar"};

然后像这样导入它们:

// Baz.vue

import { Foo, Bar } from 'FooBar.vue';

@Components({ components: { Foo }})
... // rest of the code

是否可以从Vue中的.vue文件导出多个对象?

1 个答案:

答案 0 :(得分:4)

在您的vue文件中输入:

class Foo extends Vue {
    foo: string = "foo";
}

const Bar = { bar: "bar" };

export { Bar };
export default Foo;

您将能够使用以下命令导入这些文件:

import Foo, { Bar } from 'FooBar.vue';

有关导出工作方式的更多详细信息,请参见here