Elementui 表格单元格数据操作
程序员文章站
2022-06-08 15:55:16
...
1、单元格数据操作,适用于filter解决不了的数据操作,下面是几种常用写法,也可以用 Table-column 的属性formatter
注意:这几种写法本质上是一样的,都是vue的插槽,v-slot是2.6新增的,代替之前的slot和slot-scope
第一种写法,利用 slot-scope="scope"
<el-table-column align="center" label="Windows" min-width="105">
<template slot-scope="scope">
<span>{{ scope.row.put}} | {{ scope.row.clicke }}</span>
</template>
</el-table-column>
第二种写法,利用 v-slot="scope"
<el-table-column align="center" label="Windows" min-width="105">
<template v-slot="scope">
<span>{{ scope.row.put}} | {{ scope.row.clicke }}</span>
</template>
</el-table-column>
第三种写法,利用 v-slot="{ row }" 对scope进行解构
<el-table-column align="center" label="Windows" min-width="105">
<template v-slot="{ row }">
<span>{{ scope.row.put}} | {{ scope.row.clicke }}</span>
</template>
</el-table-column>
推荐阅读
-
vue elementUI table表格数据 滚动懒加载的实现方法
-
jQuery实现合并表格单元格中相同行操作示例
-
vue elementUI table表格数据 滚动懒加载的实现方法
-
结合bootstrap fileinput插件和Bootstrap-table表格插件,实现文件上传、预览、提交的导入Excel数据操作流程
-
Excel表格对指定区域的部分数据进行锁定避免自己操作错误
-
BootStrap Fileinput插件和Bootstrap table表格插件相结合实现文件上传、预览、提交的导入Excel数据操作步骤
-
Python开发使用Pandas包进行Excel表格数据操作
-
easyuidatagrid表格内改变数据,改变其他单元格数据教程
-
WPS表格如何批量转换单元格数据格式将格式改为yyyymmdd
-
Element实现表格分页数据选择+全选所有完善批量操作