영어 대신 중국어로 된 요소 UI 페이지 표시

영어 대신 중국어로 된 요소 UI 페이지 표시

아주 좋은 요소 UI 컴포넌트를 사용하기 시작했는데, 이 컴포넌트를 사용하여 프로젝트에 추가하려고 하면

<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="currentPage4" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400">
</el-pagination>

텍스트는 중국어로 다음과 같이 표시됩니다.

JSFiddle 샘플에서도 발생하지만 웹사이트에서는 발생하지 않습니다.

영어로 어떻게 사용하는지 아세요?

import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import locale from 'element-ui/lib/locale/lang/en'
import App from './App.vue'

Vue.use(ElementUI, { locale })

new Vue({
  el: '#app',
  render: h => h(App)
})

http://element.eleme.io/ #/en-US/component/i18n

추가만 하면 됩니다.

<script src="//unpkg.com/element-ui"></script>
<script src="//unpkg.com/element-ui/lib/umd/locale/en.js"></script>

그리고.

<script>
  ELEMENT.locale(ELEMENT.lang.en)
</script>

출처: https://element.eleme.io/#/en-US/component/i18n#import-via-cdn

또한 생산 시에는 특정 버전의 unpkg을 사용하는 것이 좋습니다.최신 버전은 브라우저에 URL(선행 // 없음)을 로드한 후 리디렉션된 URL을 복사하면 찾을 수 있습니다.

'국제화' : https://element.eleme.io/ #/en-US/component/i18n

기본적으로는 Element 언어는 중국어입니다.다른 언어를 사용하려면 i18n 구성을 수행해야 합니다.

요소를 완전히 Import하는 경우: (통상 src > main.js에 있는 엔트리 파일에서 다음과 같이 설정합니다.)

import Vue from 'vue'
import ElementUI from 'element-ui'
import locale from 'element-ui/lib/locale/lang/en'

Vue.use(ElementUI, { locale })

단, 어플리케이션 전체가 아닌 온 디맨드로 요소를 Import하는 경우:

// Here we are importing only the Button and Select component from Element
import Vue from 'vue'
import { Button, Select } from 'element-ui'
import lang from 'element-ui/lib/locale/lang/en'
import locale from 'element-ui/lib/locale'

// configure language
locale.use(lang)

// import components
Vue.component(Button.name, Button)
Vue.component(Select.name, Select)

중요:중국어 팩은 다른 언어를 사용하는 경우에도 기본적으로 가져옵니다.그러나 웹 팩에서 제공되는 Normal Module Replacement Plugin을 사용하면 기본 로케일을 대체할 수 있습니다.webpack.config.js 파일

{
  plugins: [
   new webpack.NormalModuleReplacementPlugin(/element-ui[\/\\]lib[\/\\]locale[\/\\]lang[\/\\]zh-CN/, 'element-ui/lib/locale/lang/en')
  ]
}

이미 제시된 대로 로케일을 설정하고 있는 경우는, 번들에 일관성이 없는 것도 원인일 수 있습니다.

1. 번들러에 의해element-ui/locale수입품
2. 번들러가 처리해 줄 수 있습니다.element-ui로서 수입하다.external
3. 따라서 파일 자체의 요소 UI가 아닌 두 번째 복사본에 로케일을 설정합니다.
4. 그런 다음 Element-ui는 자체 복사본을 읽고 사용자의 복사본을 무시합니다.

(이러한 번들 문제를 해결한 실제 PR에 대해서는 https://github.com/3YOURMIND/kotti/pull/264을 참조하십시오.)

언급URL : https://stackoverflow.com/questions/47375440/element-ui-pagination-in-chinese-instead-of-english