2、在methods方法列表中声明表格活动行变更的方法,并绑定表格的current-change事件 //当前行变更时handleCurrentChange:function(val){this.currentRow = val !==null? val:{status:'0'}; },//绑定事件<el-table ref="myTable" @current-change="handleCurrentChange"> 3、表格查询刷新数据的事件中对当前行进...
一:首先 创建 el-table <el-table ref="BaseTable"//设置 ref属性 :highlight-current-row="true"//高光选中行 :current-row-key="NowRowIndex"//行号 :row-class-name="tableRowClassName"//装载 EL-TABLE前执行的 方法 会遍历每一行 每一个单元格 @row-click="BaseRowClick">//添加行点击事件 二:...
this.dealTableColumn(this.checkProp); }, methods: { // 搜索按钮 onSubmit() {}, // 分页 左右 点击 输入 handleSizeChange(val) { // console.log(`每页 ${val} 条`); this.pageInfo.pageSize = val; // this.loadData(); }, // 分页多少条点击事件 handleCurrentChange(val) { ...
<template> <el-table :data="transformedTableData"> <!-- el-table 的其他配置 --> </el-table> </template> <script> export default { props: { statusConfig: { type: Object, required: true }, tableData: { type: Array, required: true } }, computed: { transformedTableData() { return...
Existing Component Yes Component Name 2.6.1 Description 可否通过current-change的事件来获取到当前行的索引值,另外cell-contextmenu使用时获取到当前行的index也是undefined,可否增加右键也能获取到行索引的功能 github-actionsbotadded theinactivelabelApr 20, 2024...
<el-table-column prop="nameCn" label="产品名称" /> <el-table-column prop="specsNames" label="描述" /> </el-table> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="params.pageNo" ...
事件:current-change改变时会触发,用于监听页数改变。 data这里我是直接再表格上处理了,也可以在获取表格接口数据的时候做处理也是一样的 html部分 <div><el-table:data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)"bordersize="mini"v-loading="loading"><el-table-columnalign="center"la...
@size-change就是改变一页数据的大小 @current-change就是改变第几页,:page-size=”[1,5,10,20]”就是一页有多少条数据的选择。 实现的效果就是如下图: 这样就实现了使用post请求拿到数据渲染到el-table上面,并且实现了分页。 三、实验结果与讨论 ...
</el-table> <el-pagination style="color: #fff" v-if="pageshow" :current-page.sync="page" :page-sizes="[25, 50, 100, 200]" :page-size="limit" :total="total" layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle" ...
<el-table-column type="selection" :reserve-selection="true" width="55"> </el-table-column> <el-table-column type="index" label="编号" width="50"> </el-table-column> <div> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" ...