因此,我列出了三种不同语言的国家/地区列表:
countries-fr.js
countries-en.js
countries-de.js
我想仅根据所选语言在我的组件中要求这些文件。
目前我正在做:
<template>
...
<p v-for="country in countryList"> {{ country.name }} </p>
...
</template>
<script>
import {EN} from '../../countries-en.js'
import {DE} from '../../countries-de.js'
import {FR} from '../../countries-fr.js'
export default {
data () {
EN, FR, DE
},
computed: {
countryList () {
let lang = this.$store.state.user.lang
if(lang == "EN"){return this.EN},
if(lang == "FR"){return this.FR},
if(lang == "DE"){return this.DE},
}
}
}
这显然有效,但我不喜欢我必须事先导入这三个文件,如果我添加 100 种语言,那么我将不得不这样做。
所以,我的问题是:如何根据当前语言环境导入文件?
我可以在<script>
and 导入之前执行 if/else ,但这似乎不是导入它的理想方式。