expandRowArr.value = commentList.value.map(item => item.commentIndex),来实现全部展开的效果。最开始使用的是toggleRowExpansion方法,但是因为在数据更新时会让所有展开行恢复初始状态,从而导致折叠,因此放弃了 目前的情况是如果数据量比较多的话,全部展开就会有很明显的卡顿,我希望设置一个loading来等待展开结束,...
{ this.pageLoading = false if (res.status === '0000') { this.tags = res.data.records console.log(this.tags) } }) .catch(() => {}) }, // 展开行 expandChange(row) { if (!this.isShow) { //根据判定是否已经加载了数据 setTimeout(() => { let options = {} options.company...
以下是一个使用 el-table-column type="expand" 实现懒加载的基本示例: vue <template> <el-table :data="tableData" border> <el-table-column type="expand"> <template #default="props"> <div v-if="props.row.loading">加载中...</div> <div ...
展开行在el-table中以及提供了,使用也很简单,不过就是它只能点击左侧箭头icon来控制展开收缩,我这里是点击行的就要展开收缩。所以还需要借助 row-click和expand-change结合(因为点击icon的时候不会触发row-click),然后展开的时候就得通过设置expand-row-keys 这个来控制收缩,注意使用这个必须要设置row-key 核心就是用...
<template><div><el-tablestripe:data="tableData"style="width: 100%"@cell-click="loadData"@expand-change="expandChange"><el-table-columntype="expand"><templateslot-scope="props"><el-table:data="props.row.details"v-loading="!props.row.loadDetails"@cell-click="loadData"stripeborder><el-ta...
} }.expand{padding:30px0px30px47px; /deep/.el-form-item
searchExpand: false, statisticsNum: [], count: 0, isSelectAll: false,//全选标识 selectIds: [],//全选ids // 操作类型 type: null, customList: [], // 查询列表 async getList() { this.loading = true; const res = await getCustomList({}); ...
<el-row><el-tablev-loading="loading"size="small":data="tableData"ref="tableData"tooltip-effect="dark"style="width: 100%"max-height="600"><el-table-columntype="expand"><templateslot-scope="props"><!--子table--><el-tablesize="small":data="props.row.items"tooltip-effect="dark"style...
利用el_table的expand属性实现 代码语言:javascript 代码运行次数:0 <el-table-column type="expand"><template slot-scope="props"><el-tableborder:data="props.row.dataitems"v-loading="loading"><el-table-column label="名称"align="center"prop=/><el-table-column label="值"align=prop="value"/><...
20px"default-expand-all:tree-props="{children: 'children',hasChildren: 'hasChildren',}"v-loading="loading"><el-table-columnwidth="300"label="类目"><templateslot-scope="scope"><spanv-if="scope.row.id > 0">{{ scope.row.name }}</span><el-inputv-elseref="input"@blur="inputBlur(...