在我們的 Vue 應用程式中，我們動態載入翻譯。在它們從伺服器到達之前，我們的字串將顯示為代碼/表達式。
如果沒有載入訊息，是否有某種方法告訴 Vue-i18n 預設為空白？或者我可以重寫某些內容以返回空字串嗎？
Vue-i18n
您可以透過在 VueI18n 初始化中新增 fallbackLocale 屬性來實現此目的。
VueI18n
fallbackLocale
正如下面的演示中，語言環境 ja 不可用，因此，它加載 fallbackLocale （我在預設語言環境的所有屬性中添加了空字串）。 p>
ja
現場示範：
const messages = { en: { message: { tokyo: 'Tokyo', newyork: 'New York', london: 'London' } }, default: { message: { tokyo: '', newyork: '', london: '' } } } const i18n = new VueI18n({ locale: 'ja', fallbackLocale: 'default', messages, }) new Vue({ i18n, data: {cities: ['tokyo', 'newyork', 'london']} }).$mount('#app')
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-i18n/8.14.1/vue-i18n.min.js"></script> <div id="app"> <ul> <li v-for="city in cities" :key="city"> {{city}}: {{ $t("message." + city) }} </li> </ul> </div>
您可以透過在
VueI18n初始化中新增fallbackLocale屬性來實現此目的。正如下面的演示中，語言環境
ja不可用，因此，它加載fallbackLocale（我在預設語言環境的所有屬性中添加了空字串）。 p>現場示範：
const messages = { en: { message: { tokyo: 'Tokyo', newyork: 'New York', london: 'London' } }, default: { message: { tokyo: '', newyork: '', london: '' } } } const i18n = new VueI18n({ locale: 'ja', fallbackLocale: 'default', messages, }) new Vue({ i18n, data: {cities: ['tokyo', 'newyork', 'london']} }).$mount('#app')<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-i18n/8.14.1/vue-i18n.min.js"></script> <div id="app"> <ul> <li v-for="city in cities" :key="city"> {{city}}: {{ $t("message." + city) }} </li> </ul> </div>