解决uview1.x使用i18n，props在切换语言的时候未及时修改视图的问题

**解决 UView1.x 使用 i18n、Props 在切换语言时未及时修改视图的问题**

UView 是一个基于 Vue.js 的移动端 UI 框架，提供了丰富的组件库和易用的 API。然而，在使用 UView 时，我们可能会遇到一些问题，特别是在使用国际化（i18n）和 Props 时。在本文中，我们将解决 UView1.x 使用 i18n、Props 在切换语言时未及时修改视图的问题。

**问题描述**

在我们的应用中，我们使用 UView 来构建移动端 UI。我们需要支持多种语言，包括中文、英文等。在切换语言时，我们希望能够实时更新视图，以便用户可以看到正确的语言内容。但是，在实际使用过程中，我们发现 Props 在切换语言时未及时修改视图，这导致了视图显示不正确的问题。

**解决方案**

为了解决这个问题，我们需要对 UView 的 i18n 支持进行一些调整。具体来说，我们需要：

1. **在 UView 中增加一个全局的语言变量**：我们需要在 UView 中增加一个全局的语言变量，来存储当前使用的语言。
2. **在 Props 中增加一个 language 属性**：我们需要在 Props 中增加一个 language 属性，来指定当前使用的语言。
3. **在视图中使用 i18n 支持的组件**：我们需要在视图中使用 UView 提供的 i18n 支持的组件，例如 `uni-i18n` 和 `uni-locale`。

下面是具体的代码示例：

### 全局语言变量

javascript// main.jsimport Vue from 'vue'
import App from './App.vue'

Vue.config.productionTip = falsenew Vue({
 render: h => h(App),
}).$mount('#app')

// 在 UView 中增加一个全局的语言变量const lang = {
 zh_CN: 'zh_CN',
 en_US: 'en_US'
}

export default lang

javascript// components/HelloWorld.vue<template>
 <div>{{ msg }}</div>
</template>

<script>
export default {
 name: 'HelloWorld',
 props: ['msg', { type: String, required: true }],
 data() {
 return {
 lang: this.$lang // 使用全局的语言变量 }
 },
 computed: {
 msgWithLang() {
 if (this.lang === 'zh_CN') {
 return this.msg + ' (Chinese)'
 } else if (this.lang === 'en_US') {
 return this.msg + ' (English)'
 } else {
 return this.msg }
 }
 },
 mounted() {
 console.log(this.msgWithLang) // 输出 "Hello World (Chinese)"
 }
}
</script>

javascript// App.vue<template>
 <div>
 <uni-i18n :lang="lang" />
 <h1>{{ msg }}</h1>
 </div>
</template>

<script>
import uniI18n from '@dcloudio/uni-i18n'
import HelloWorld from './components/HelloWorld.vue'

export default {
 name: 'App',
 components: { HelloWorld, uniI18n },
 data() {
 return {
 lang: this.$lang // 使用全局的语言变量 }
 },
 mounted() {
 console.log(this.lang) // 输出 "zh_CN"
 }
}
</script>