vue3 i18n動(dòng)態(tài)獲取key的實(shí)現(xiàn)方式
更新時(shí)間：2025年09月17日 08:54:43 作者：ana_9717
在Vue3項(xiàng)目中,使用i18n動(dòng)態(tài)獲取keyzh文件時(shí),直接用中括號(hào)無效,需改用數(shù)組形式如$[key, 'zh'],明確指定語言代碼以正確加載翻譯
vue3 i18n動(dòng)態(tài)獲取key
項(xiàng)目中使用vue3 加 i18n， 需要?jiǎng)討B(tài)獲取key
zh文件
{
zh: {
a: '啊aaa'，
b: 'bbb'，
c: 'cccc'，
d: 'dddd'，
}
}正常用中括號(hào)獲取發(fā)現(xiàn)沒生效
const test = [
'a' , 'b', 'c', 'd'
]
<var-option
v-for="item in test "
:key="item"
:label="$t('zh[item]')"
:value="item"
/>調(diào)查了半天發(fā)現(xiàn)需要這么寫就好了
<var-option
v-for="item in test "
:key="item"
:label="$t('zh.'+ item)"
:value="item"
/>總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue 路由緩存 路由嵌套 路由守衛(wèi) 監(jiān)聽物理返回操作
這篇文章主要介紹了vue 路由緩存 路由嵌套 路由守衛(wèi) 監(jiān)聽物理返回操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-08-08
easycom是Uniapp框架中非常方便的組件自動(dòng)注冊(cè)機(jī)制，可以大大簡(jiǎn)化組件的使用和管理，這篇文章主要介紹了uniapp中easycom用法詳解,需要的朋友可以參考下2023-03-03
這篇文章主要為大家詳細(xì)介紹了vue封裝全局過濾器的方法,文中的示例代碼講解詳細(xì),具有一定的借鑒價(jià)值,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-12-12
vue+node實(shí)現(xiàn)圖片上傳及預(yù)覽的示例方法
這篇文章主要介紹了vue+node實(shí)現(xiàn)圖片上傳及預(yù)覽的示例方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-11-11
本文詳細(xì)介紹了從vue的組件傳值著手觀察者模式，感興趣的同學(xué)，可以參考下，理解其原理。2021-06-06
解決Vue2跨域報(bào)錯(cuò)AxiosError?net::ERR_FAILED、?Network?Error、ERR_N
這篇文章主要給大家介紹了關(guān)于解決Vue2跨域報(bào)錯(cuò)AxiosError?net::ERR_FAILED、?Network?Error、ERR_NETWORK的相關(guān)資料,文中通過圖文介紹的非常詳細(xì),需要的朋友可以參考下2022-11-11
基于Vue實(shí)現(xiàn)鼠標(biāo)滾動(dòng)輪控制頁面橫向滑動(dòng)效果
這篇文章主要介紹了如何基于Vue實(shí)現(xiàn)鼠標(biāo)滾動(dòng)輪控制頁面橫向滑動(dòng)效果,文中通過代碼示例和圖文結(jié)合的方式給大家講解的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2024-09-09
本篇文章主要介紹了Vue.use自定義自己的全局組件，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-06-06
el-date-picker日期時(shí)間選擇器的選擇時(shí)間限制到分鐘級(jí)別
文章介紹了如何使用el-date-picker 組件來限制用戶選擇的時(shí)間,禁止選擇當(dāng)前時(shí)間的日期及時(shí)分,同時(shí)允許選擇其他日期的全天時(shí)分,通過設(shè)置 `pickerOptions` 對(duì)象的屬性,可以實(shí)現(xiàn)對(duì)日期和時(shí)間的精確控制,感興趣的朋友跟隨小編一起看看吧2025-01-01
Vue實(shí)現(xiàn)父子組件的事件傳遞的示例代碼
在Vue.js這個(gè)現(xiàn)代化的前端框架中,組件化是其核心理念之一,正確的組件間通信是實(shí)現(xiàn)高效和可維護(hù)代碼的關(guān)鍵,在許多應(yīng)用程序中,父子組件之間的事件傳遞是一個(gè)常見的需求,,本文將深入探討在Vue中如何實(shí)現(xiàn)父子組件的事件傳遞,并輔以示例代碼來展示這些概念2025-01-01