nuxt:访问存储在vuex存储中的全局变量

Question

在我的NUXT应用程序中，我必须为我的所有组件共享一个全局数组。例如，此数组包含一周的标签：

export const state = () => ({
days: [
{ code: '1', label: 'Lundi' },
{ code: '2', label: 'Mardi' },
{ code: '3', label: 'Mercredi' },
...
]
})
export const getters = {
getDayLabel (state, dayCode) {
return state.days[dayCode]
},
}

在我的组件中，我必须显示一天的标签。为此，我在组件的模板中写道：

{{$store.getters['getDayLabel'](dayCode)}}

但是，我有这个错误：

app.js:262类型错误：_vm$store.getters.getDayLabel不是函数

我在一些主题中读到，getter函数不应该有参数？有更好的解决方案吗？

孙。

Answer 1

您不需要在存储中为getter 指定新参数

例如，在getter中，您只使用索引检索信息：

export const getters = {
getDayLabel: state => index => state.days[index]
}

在模板中：{{$store.getters['getDayLabel'](1).label }} --> output = Mardi

如果你真的想用代码搜索，你可以使用过滤功能：

getDayLabel: state => {
return dayCode => state.days.filter(c => {
return c.code === dayCode
})
}

在模板中：{{$store.getters['getDayLabel'](2)[0].label }} --> output = Mardi

更多信息点击这里Github发布

我不知道这是否是一个好的做法，因为我以前从未这样使用过它，我总是直接在组件中对数据进行筛选。