Uni-App 定义多语言字符串资源并引用

点滴积累，贵在坚持，感谢你的阅览！

1、在项目根目录下新建 locale 目录，然后在 locale 目录下新建两个字符串资源文件，如下：

├── locale
│   ├── en.json
│   └── zh-Hans.json

2、以 zh-Hans.json 为例，定义如下字符串,en.json 也一样

{
    "appbar_name":"MyTestUniApp",
    "appbar_title":"Uni-App测试应用",
    "page_jump":"页面的点击跳转",
    "different_oritation":"不同的布局方向"
}

3、然后引用，在 pages.json 中使用%%来引用

	"pages": [
		{
			"path": "pages/index/first-page",
			"style": {
				"navigationBarTitleText": "%appbar_title%"
			}
		}
    ]

4、我尝试在 vue 文件中这样引用，但是失败了，目前还在找原因

<template>
    <view class="content">
        <button class="jump-next" @click="jumpSecondPage">{{ $t('page_jump')}}</button>
        <button class="oritation" @click="diffOritation">{{ $t('different_oritation')}}</button>
    </view>
</template>

5、如果是在data中返回的数据如何使用呢？比如我们在data中定义返回一个 city

<script>
    export default {
        data() {
            return {
                city:"武汉"
            }
        }
    }
</script>

可以这样使用：

<text>城市：{{ city }}</text>
<uni-list>
    <uni-list-item :title="city"></uni-list-item>
</uni-list>

6、如果是数据集合如何使用呢，比如定义mainList数据集合：

<script>
    export default {
        data() {
            return {
                mainList: [{
                        title: "页面的点击跳转",
                        linkTo: "second-page"
                    },
                    {
                        title: "不同的布局方向",
                        linkTo: "diff-oritation"
                    },
                    {
                        title: "轮播图示例",
                        linkTo: "swiper"
                    }
                ]
            }
        }
    }
</script>

可以这样使用：

<template>
    <view class="content">
        <uni-list>
            <uni-list-item v-for="(item, index) in mainList" :title="item.title" :to="item.linkTo">
            </uni-list-item>
        </uni-list>
    </view>
</template>