Vue.js/导入导出ES6问题与const

我有一个settings.js文件，其结构如下：

settings.js：

export const availableDatabaseColumns = {
        accountmode : 'Accountype',
        customergroup : 'Customer Group',
}

然后，在我的组件中，我执行以下操作：

import * as settings from '../settings/settings';

<p v-for="(item, key) in settings.availableDatabaseColumns">{{ item }}</p>

在模板标记中，我执行以下操作：

import * as settings from '../settings/settings';

<p v-for="(item, key) in settings.availableDatabaseColumns">{{ item }}</p>

---

我缺少什么？

组件在渲染模板期间不显示变量

设置

，因为您没有将其装入组件（换句话说

this.settings==未定义的
）。
您应该在
created（）
组件挂钩中写入：

created() {
    this.settings = settings
}

在渲染模板期间，组件不会显示变量
设置
，因为您没有将其装入组件中（换句话说
this.settings===undefined
）。
您应该在
created（）
组件挂钩中写入：

created() {
    this.settings = settings
}

最好在
data
方法中执行此操作：
data（）{return{settings}}
@thanksd如果在data（）方法中创建它，Vue将为设置创建反应数据，这是多余的。如果您在created（）中编写此.settings=settings，hook Vue将使用非反应性数据创建私有作用域。我明白您的意思，并且我猜如果
设置
对象非常庞大，那么就有理由不使用
数据
方法。但是我仍然认为，性能上的小小提高不会超过人们对为什么
这一点可能产生的困惑。设置
不是被动的。最好使用
数据
方法：
数据（）{return{settings}}
@thanksd如果在data（）方法中创建它，Vue将为设置创建被动数据，这是多余的。如果您在created（）中编写此.settings=settings，hook Vue将使用非反应性数据创建私有作用域。我明白您的意思，并且我猜如果
设置
对象非常庞大，那么就有理由不使用
数据
方法。但我仍然认为，性能的微小提升并不能掩盖人们对为什么
这个设置不起作用的困惑。