Méthodes de traitement standard dans Vue (tutoriel détaillé)-js tutoriel-php.cn

Méthodes de traitement standard dans Vue (tutoriel détaillé)

亚连

Libérer： 2018-06-20 10:32:53

original

1166 Les gens l'ont consulté

L'éditeur ci-dessous partagera avec vous un article sur les méthodes de traitement d'internationalisation sous Vue. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde. Suivons l'éditeur et jetons un coup d'œil

1 : Installez d'abord Vue-i8n

npm install vue-i18n --save

Remarque : -save-dev fait référence à l'ajout d'informations sur le package aux devDependencies, indiquant les packages dont vous dépendez lors du développement. -save signifie ajouter des informations sur le package aux dépendances, indiquant les packages dont vous dépendez lors de la publication.

2 : Configurer les informations dans main.js

import VueI18n from &#39;vue-i18n&#39;
import {getCookie} from &#39;./common/cookie&#39; //引入一个js文件，使用引入的函数getCookie，根据当前缓存切换语言
Vue.use(VueI18n)
const i18n = new VueI18n({
　　locale: getCookie(&#39;PLAY_LANG&#39;,&#39;cn-zh&#39;), //根据当前语言切换
　　messages: {
　　　　&#39;cn-zh&#39;: require(&#39;./language/cn-zh&#39;), //中文语言包
　　　　&#39;en-us&#39;: require(&#39;./language/en-us&#39;) //英文语言包
　　}
})
new Vue({
　　el: &#39;#app&#39;,
　　i18n, // 不要忘记
　　router,
　　template: &#39;<App/>&#39;,
　　components: { App }
})

Copier après la connexion

3 : Créez-en une nouvelle sous le répertoire src Le fichier de langue doit être stocké autant que possible au même niveau que main.js. Ajoutez deux fichiers js, cn-zh et en-us, pour stocker les langues qui doivent être traduites .

4 : fonction getCookie

function getCookie(name,defaultValue) {
　　var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); //"(^| )" 匹配开头和空格
　　if (arr = document.cookie.match(reg))
　　　　return unescape(arr[2]);
　　else
　　　　return defaultValue;
}
export {
　　getCookie
}

Copier après la connexion

Ce qui précède est ce que j'ai compilé pour tout le monde. J'espère que cela sera utile à tout le monde. avenir.