1、下载插件，解压，引入vue-i18n.js包

2、在static目录中创建lang文件夹，并创建cn.json和en.json文件

cn.json

{
	"tab": {
		"user":"我的"
	},
	"user": {
		"customer":"客户：",
		"switch_account":"切换账号",
		"logout":"退出登录",
		"funs_1": "密码修改",
		"funs_2": "App二维码1",
		"funs_3": "App二维码2",
		"funs_4": "App二维码3",
		"funs_5": "App二维码4",
		"funs_6": "App二维码5"
	}
}

en.json

{
	"tab": {
		"user":"User"
	},
	"user": {
		"customer":"Customer:",
		"switch_account":"Switching accounts",
		"logout":"Logout",
		"funs_1": "Change password",
		"funs_2": "App QRcode1",
		"funs_3": "App QRcode2",
		"funs_4": "App QRcode3",
		"funs_5": "App QRcode4",
		"funs_6": "App QRcode5"
	}
}

3、修改main.js

import Vue from 'vue'
import App from './App'
//引入国际化
import VueI18n from 'vue-i18n'

Vue.config.productionTip = false

Vue.use(VueI18n)

App.mpType = 'app'

const i18n = new VueI18n({
	locale: 'cn',
	messages: {
		'cn': require('./static/lang/cn.json'),
		'en': require('./static/lang/en.json')
	}
});

Vue.prototype._i18n = i18n

const app = new Vue({
	i18n,
    ...App
})
app.$mount()

4、使用{{$t('user.customer')}}或者this.$t('tab.user')进行国际化

<template>
	<view class="my_page">
		<!--导航栏-->
		<uni-nav-bar contentColor="#ffffff" :status-bar="true" :title="title" backgroundColor="#155dff"/>
		<!--用户头像信息-->
		<view class="user_info">
			<image :src="userInfo.avatar" class="login_avatar"></image>
			<view class="login_info">
				<view class="login_account">{{userInfo.account}}</view>
				<view class="login_nickname">{{$t('user.customer')}}{{userInfo.nickname}}</view>
			</view>
		</view>
		<!--功能模块信息-->
		<view class="user_func">
			<!--第一项-->
			<view class="user_item" v-for="(item, index) in userFuncs" :key="index" @click="navigate(index)">
				<view class="user_item_left">
					<image :src="item.icon" class="user_item_left_img"></image>
					<view class="user_item_left_text">{{item.title}}</view>
				</view>
				<view class="user_item_right">
					<image src="../../../static/images/arr_right.png" class="user_item_right_img"></image>
				</view>
			</view>
		</view>
		<!--按钮-->
		<view class="user_btns">
			<view class="btn_item">{{$t('user.switch_account')}}</view>
			<view class="btn_item">{{$t('user.logout')}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: this.$t('tab.user'),
				userInfo:{
					avatar: "../../static/images/user_head.png",
					account: "VEICHI",
					nickname: "VEICHI",
				},
				userFuncs:[
					{icon: "../../static/images/icon_liebiaomoshi@2x.png", "title": this.$t('user.funs_1')},
					{icon: "../../static/images/icon_liebiaomoshi@2x.png", "title": this.$t('user.funs_2')},
					{icon: "../../static/images/icon_liebiaomoshi@2x.png", "title": this.$t('user.funs_3')},
					{icon: "../../static/images/icon_liebiaomoshi@2x.png", "title": this.$t('user.funs_4')},
					{icon: "../../static/images/icon_liebiaomoshi@2x.png", "title": this.$t('user.funs_5')},
					{icon: "../../static/images/icon_liebiaomoshi@2x.png", "title": this.$t('user.funs_6')}
				]
			}
		},
		onLoad() {
			
		},
		methods: {
			navigate(index){
				switch(index){
					case 0:
						uni.navigateTo({
							url: "../mine/change_pwd/change_pwd"
						});
						break;
					case 1:
						uni.navigateTo({
							url: "../map/map"
						});
						break;
					default:
						uni.navigateTo({
							url: "../mine/app_qr/app_qr"
						});
						break;
				}
			}
		}
	}
</script>

<style>
	@import url("mine_page.css");
</style>

完！！！