vue中表格如何中英文切换？

这是第一种情况，是完全前端来控制列表的中英文

<el-table-columnprop="productState":label='$t("production.ProductState")':render-header="icons"min-width="100"><template slot-scope="scope">{{$t(statusMap[scope.row.productState])}}</template>
</el-table-column>

在data里面

   statusMap:{0:"production.reviewRejected",1:"production.draft",2:"production.pendingReview",3:"production.pendingSell",4:"production.selling",5:"production.stopSell",}

第二种情况，是后端给了两套，一套中文的，一套英文的

首先是初始化默认进来的，使用的vuex，调用的语言切换的状态

然后需要在页面上监听中英文的切换，1，先引用 2，使用watch来监听，3，还要在data里面定义

4，在页面上使用

1，引用

2，监听页面上的语言切换的变化，发图片了，并且把图片的代码也搞出来了，方便粘贴

computed: {...mapGetters(['language'])},watch: {...mapGetters(['language']),language(val){this.now_language = valthis.uploadLange= falsethis.$nextTick(() => {this.uploadLange= true});}},

3，在data里面定义

4.在页面上使用

附加，把vuex的也放过来

vue中表格如何中英文切换？相关推荐

vue＋element实现中英文切换
1.安装 vue-i18n依赖 yarn add vue-i18n 或者 npm install vue-i18n --save-dev 2.在src下新建文件夹language,并在文件夹langu ...
vue+elementUI+vue-i18n实现中英文切换。
安装: npm install vue-i18n vue.js+vue-i18n国际化在main.js同级建i18n文件夹,并里面建i18n.js.langs文件夹,langs文件夹下建en.js. ...
vue根据按钮进行中英文切换
刚学习vue不久,所以对vue了解还不是很深,一直处于边做边查的状态,这几天开发一个双语网站. 内容如下,希望对大家有帮助. 安装 vue-i18n插件npm install vue-i18n 1.首 ...
Ant Design Vue中tabs标签页切换导致页面变宽的问题
问题在使用Ant Design Vue进行开发的时候,使用了tabs标签页,在页里面套用了表格,但是在页面切换后,会发现页面的width会变大差不多2倍,这样会导致页面一些结构的样式发生变化. 解决 ...
vue中使用国际化i8n切换语言
1 安装依赖 //安装antd插件,这个跟i18n无关,写整体页面的时候用的这个插件 npm install ant-design-vue --save-dev //安装i18n依赖 npm inst ...
Vue使用虚拟键盘+中英文切换
1.安装依赖 npm install simple-keyboard --save npm install simple-keyboard-layouts --save 2.虚拟键盘组件 simple ...
HTML如何实现页面中英文切换,关于html页面中怎样实现中英文切换的实例分享
如何实现html页面的双语切换呢?最粗暴的办法是做两个页面,一个中文的,一个英文的.稍微温和的方法是:在每次显示之前,对当前的语言标志进行判断,用if和else来解决,其实,这种办法虽然没有那么粗暴, ...
vue中element国际化语言切换
一. 安装依赖 npm install vue-i18n 二. 创建文件在src目录下先创建一个lang 文件夹,再创建两个js文件en.js(英文), zh.js(中文), 另外创建一个index ...
vue中实现国际化--语言切换(转载)
https://segmentfault.com/a/1190000011800593 转载于:https://www.cnblogs.com/aidixie/p/10215892.html

vue中表格如何中英文切换？

vue中表格如何中英文切换？相关推荐

最新文章

热门文章