Vue의 표준 처리 방법(자세한 튜토리얼)

아래 편집자는 Vue에서 국제화 처리 방법을 공유할 것입니다. 이는 좋은 참고 가치가 있으며 모든 사람에게 도움이 되기를 바랍니다. 편집기를 따라 살펴보겠습니다

1: 먼저 Vue-i8n을 설치하세요

npm install vue-i18n --save

참고: -save-dev는 devDependency에 패키지 정보를 추가하는 것을 의미합니다. 개발 중에 의존하는 패키지입니다. -save는 종속성에 패키지 정보를 추가하여 게시할 때 의존하는 패키지를 나타내는 것을 의미합니다.

2: 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: src 디렉토리에 새 언어 파일을 생성하고, 가능한 한 main.js와 같은 레벨에 저장하고, js 파일 2개를 추가합니다. , cn-zh 및 en-us, 번역이 필요한 언어를 저장하기 위해

4: 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
}

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로도 모든 사람에게.

관련 기사:

Vue에서 숫자 입력 상자 구성 요소를 구현하는 방법

jquery를 사용하여 왼쪽 및 오른쪽 사이드바 크기 조정 효과를 얻는 방법

JS 함수의 setTimeout에 대한 자세한 소개

in mongoose 객체 업데이트에 대한 자세한 소개가 있습니다

JavaScript에서 AOP를 구현하는 방법

nginx + node를 사용하여 https를 배포하는 방법

위 내용은 Vue의 표준 처리 방법(자세한 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!