How to set Chinese in vue

Setting the Chinese language in Vue.js requires: 1. Install the VueI18n plug-in; 2. Create a language file; 3. Configure VueI18n in main.js; 4. Use the $t() method to obtain the translation string .

How to set Chinese in Vue.js

To set Chinese language in Vue.js, you can use the following Steps:

1. Install VueI18n

VueI18n is a Vue.js plug-in for managing internationalization. Install in the terminal:

<code>npm install vue-i18n</code>

2. Create a language file

Create a file named lang/zh-CN.js (where zh-CN represents simplified Chinese):

<code class="js">export default {
  message: '你好，世界！'
}</code>

3. Configure VueI18n in

main.js

##main.js file, import VueI18n and install it to the Vue instance:

<code class="js">import Vue from 'vue'
import VueI18n from 'vue-i18n'
import messages from './lang/zh-CN.js'

Vue.use(VueI18n)

const i18n = new VueI18n({
  locale: 'zh-CN', // 设置默认语言为中文简体
  messages // 加载语言文件
})</code>

4. Use the translation string

in the Vue component , you can use the

$t() method to get the translated string:

<code class="html"><template>
  <p>{{ $t('message') }}</p>
</template>

<script>
export default {
  ...
}
</script></code>

Now, your Vue application will display the Chinese translation.

The above is the detailed content of How to set Chinese in vue. For more information, please follow other related articles on the PHP Chinese website!