vue3中的vue-18n的table表格标题不动态变化中英文
使用 computed 即可
eg:
const columns = computed(() => {
return reactive<any>([
{
title: proxy.$t('device.pm.table.index'),
dataIndex: 'index',
width: 50,
slotName: 'indexsort',
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.deviceName'),
dataIndex: 'deviceName',
width: 100,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.departmentName'),
dataIndex: 'departmentName',
slotName: 'depName',
width: 200,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.deviceTypeName'),
dataIndex: 'deviceTypeName',
width: 100,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.manufacturerName'),
dataIndex: 'manufacturerName',
width: 100,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.modelNumber'),
dataIndex: 'modelNumber',
width: 100,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.reminderTime'),
dataIndex: 'reminderTime',
width: 150,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.period'),
dataIndex: 'period',
width: 100,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('device.pm.table.countdown'),
dataIndex: 'countdown',
width: 110,
ellipsis: true,
tooltip: true,
},
{
title: proxy.$t('operate'),
width: 200,
align: 'center',
dataIndex: 'manufacturerName',
slotName: 'operation',
ellipsis: true,
tooltip: true,
fixed: 'right',
},
]);
})
vue3中的vue-18n的table表格标题不动态变化中英文的更多相关文章
- Vue3学习(十一)之 table表格组件的使用
一.前言 大约有两周没学习更文,不是懒,而是没心情,相亲路屡战屡败,着实很影响心情. 我想这世上对我而言,最难的事,莫过于恋爱结婚了,再一次经历了见光死的高光时刻. 二.又见Ant Design Vu ...
- 封装Vue Element的table表格组件
上周分享了几篇关于React组件封装方面的博文,这周就来分享几篇关于Vue组件封装方面的博文,也好让大家能更好地了解React和Vue在组件封装方面的区别. 在封装Vue组件时,我依旧会交叉使用函数式 ...
- html中table表格标题固定表数据行出现滚动条
需求 web系统中有的用户不喜欢分页,希望数据能在一个页面中全部显示出来. 但是页面中是有滚动条的,当查看下面的数据时就不知道数据行中的列对应的是哪个标题的列. 也就是无法知道这个列是什么数据. 所以 ...
- vue+element-ui:table表格中的slot 、formatter属性
slot 插槽,table中表示该行内容以自定义方式展示 :formatter 方法,用来格式化内容 Function(row, column, cellValue, index) html < ...
- vue + element ui table表格二次封装 常用功能
因为在做后台管理项目的时候用到了大量的表格, 且功能大多相同,因此封装了一些常用的功能, 方便多次复用. 组件封装代码: <template> <el-table :data=&qu ...
- 封装Vue Element的可编辑table表格组件
前一段时间,有博友在我那篇封装Vue Element的table表格组件的博文下边留言说有没有那种"表格行内编辑"的封装组件,我当时说我没有封装过这样的组件,因为一直以来在实际开发 ...
- 封装Vue纵向表头左右结构的table表格
我们前端开发人员在使用表格的过程中,大概率碰到的都是表格头部在表格的最上边,然后呈一行展示,紧接着就是表格的每一行的每一个单元格来展示具体内容的场景,很少会遇到表格的头部呈纵向一行展示,也就是说表格的 ...
- vue+iview中的table表格导出excel表格
一.iveiw框架中table中有exportCsv()方法可以导出.csv后缀文件,类似于excel文件,但是并不是excel文件. 二.实现table表格导出excel文件利用Blob.js 和 ...
- Vue之循环遍历Json数据,填充Table表格
简单记一次Vue循环遍历Json数据,然后填充到Table表格中,展示到前端的代码: async getData(id) { const res = await this.$store.api.new ...
- Vue + Element-ui实现后台管理系统(5)---封装一个Form表单组件和Table表格组件
封装一个Form表单组件和Table组件 有关后台管理系统之前写过四遍博客,看这篇之前最好先看下这四篇博客.另外这里只展示关键部分代码,项目代码放在github上: mall-manage-syste ...
随机推荐
- stable diffusion 实践与测试
stable diffusion 实践与测试 放大 原图高清放大 原始图片 当不满意图片质量的时候 使用stable diffusion进行二次处理 选择适合图片风格的模型,再次根据图片写出提示词 输 ...
- 【OracleDB】 08 子查询
什么是子查询? 子查询是一种常用计算机语言SELECT-SQL语言中嵌套查询下层的程序模块. 当一个查询是另一个查询的条件时,称之为子查询. Oracle的子查询语法公式: SELECT select ...
- 斯坦福AI团队被质疑抄袭国产大模型
原文地址: https://mbd.baidu.com/newspage/data/landingsuper?context={"nid"%3A"news_8882699 ...
- 【转载】 优必选悉尼 AI 研究院何诗怡:基于课程学习的强化多标签图像分类算法 | 分享总结
原文地址: https://baijiahao.baidu.com/s?id=1603057342167437458&wfr=spider&for=pc 来源"雷锋网&quo ...
- 【转载】 tf.slice()介绍
原文地址: https://blog.csdn.net/nini_coded/article/details/79852031 版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议, ...
- 腾达Tenda电力猫PA3的无线名称和密码
趁着2023年的双11,买了一对腾达电力猫,毕竟在家里长距离使用这东西还是蛮方便的. =============================== 配置其实蛮简单的,配对嘛,就是两个都插上电,然后在 ...
- 强化学习baseline论文—— rainbow算法中给出实验结果的54个atari2600游戏名称列表
alien amidar assault asterix asteroids atlantis bank_heist battle_zone beam_rider berzerk bowling bo ...
- 华为最高学术成果发表 —— 《Nature》正刊发表论文《Accurate medium-range global weather forecasting with 3D neural networks》
论文<Accurate medium-range global weather forecasting with 3D neural networks>的<Nature>地址: ...
- vue之事件监听v-on
1.背景 2.简单使用 2.1.做一个简单的点击计数器 <!DOCTYPE html> <html lang="en" xmlns:v-on="http ...
- SeaTunnel毕业!首个国人主导的数据集成项目成为Apache顶级项目
采访嘉宾 | 郭炜.高俊 编辑 | Tina 北京时间 2023 年 6 月 1 日,全球最大的开源软件基金会 Apache Software Foundation(以下简称 ASF)正式宣布 Apa ...