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

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

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
}

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.

Articles connexes :

Comment implémenter le composant de zone de saisie de nombres dans Vue

Comment utiliser jquery pour obtenir la gauche et la droite effet de mise à l'échelle de la barre latérale

Introduction détaillée à setTimeout dans la fonction JS

Introduction détaillée à la mise à jour des objets dans mangouste

Comment implémenter AOP en JavaScript

Comment déployer https à l'aide de nginx + node

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!