vue i18n web 前端國際化

2022-04-02 01:23:06 字數 770 閱讀 9037

vue-i18n是乙個針對於vue的國際化外掛程式,使用非常簡單

npm install vue-i18n

建立兩個檔案,乙個為zh.js代表中文,en.js代表英文,具體內容格式如下

zh.js檔案                     en.js檔案

// 引入外掛程式和語言包

import vuei18n from 'vue-i18n'

import zh from './i18n/langs/zh'

import en from './i18n/langs/en'

vue.use(vuei18n)

//例項化vue-i18n

const i18n = new vuei18n(

})// 將i18n例項掛載到vue上

4. 在元件中使用

在元件中使用,主要有插值表示式中的使用,標籤屬性的使用,js中的使用

插值表示式中的使用

}標籤中屬性的使用

js中的使用

語言國際化 vue i18n

安裝依賴包 npm i vue i18n s 在根目錄建立乙個 lang的資料夾,並且在lang資料夾內建立cn.js 和 en.js 開啟 main.js,注入vue例項中 import vue from vue import vuei18n from vue i18n 語言國際化 vue.use...

vue i18n和ElementUI國際化使用總結

vue i18n 安裝 npm install vue i18n 在main.js同級建i18n資料夾,並裡面建i18n.js langs資料夾,langs資料夾下建en.js cn.js 目錄如下 assets logo.png components helloworld.vue i18n i18...

Vue I18n國際化語言切換

近期業務需求,需要對原有專案進行國際化處理,該專案是基於vue2 vantui2.x的移動端h5spa專案。上網查閱了相關資料,大多推薦使用vue i18n國際化外掛程式來實現不同語言的切換。經過測試,已基本實現中文和英文兩種語言的切換。現在主流的前端ui框架也支援語言國際化,若專案中使用ui框架比...