Maison >interface Web >js tutoriel >Méthodes de traitement standard dans Vue (tutoriel détaillé)

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

亚连
亚连original
2018-06-20 10:32:531196parcourir

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn