uni-app 项目小功能 tabs标签切换以及中英文切换（涉及vuex使用）

页面：

业务分析：
不同滑块，数据列表不同
滑块的文字部分统一管理，且中英文可切换
使用vuex管理

//标签部分：
<view class="tab-box">
	<view class="content" :style="{top: 'calc(' + (headerTop + statusBarHeight) + 'px + 100rpx)'}">
	  <u-tabs 
	  :list="tabList" 
	  :is-scroll="false" 
	  :current="current" 
	  @change="tabsChange">
	  </u-tabs>
	</view>
</view>
//标签下对应的列表部分：(没写全)
<block v-for="(item,index) in ipiwList" :key="index">
		 <view @click="goDetail(item.id)">
				<view class="u-flex u-m-b-20">
						<view class="u-flex-6 title">
						{{item.receiveAddress}}
						</view>
				</view>
		</view>
</block>

js部分：

onLoad(option) {
		//得到[{name:'d待确认',code:'W'}]这样的数组
		this.tabList = this.billConfirmStatList.filter(x => x != 'X').map(x => {
			return {name: this.lang.billConfirmStat[x], code: x}
		})
		 //将tab最后一个“全部”push进数组
		 this.tabList.push({name: '全部', code: ''});
	}
methods:{
    //标签切换事件：
    tabsChange(current) {
           //当前点击tab
			this.current = current;
			//请求参数中的Tab变成当前被点击的
			this.oParams.status = this.tabList[this.current].code;
			//调用后台请求方法
			this.queryList();
		},
}

补充：中英文切换
1.lib/lang/zh.js

export default{
     // 单据确认状态
	"billConfirmStat": {
		"W": "待确认",
		"O": "确认",
		"D": "异议",
		"X": "失效",
	},
}

2.store/index.js

import zh from '@/lib/lang/zh.js'
import en from '@/lib/lang/en.js'
const store = new Vuex.Store({
	state: {
	// 单据确认状态
		billConfirmStatList: ['W','O','D','X'],
		billConfirmStatColor: {
			W: '#1890FF',
			O: '#39b54a',
			D: '#E02020',
			X: '#999999',
		},