1、设置只可以展开一行 table里面事件添加 <el-table class="elTable"ref="machineTable":data="machineDataList" :row-key="(row) => { return row.id }" @expand-change="handleExpandChange" @row-click="handledetail11"> method: handleExpandChange(row,rows){varthat =thisif(rows.length>1) { th...
expandsList.value.push(row.id)} //点击第二次展开栏收回 function handleExpandChange(row, index) { expandsList.value = []; if (index.length != 0) { expandsList.value.push(row.dataType); expandTableData.value = row.list; } }
Vue element-ui table 只允许展开一行, vue页面 <el-tableref="table"border stripe :data="tableData"@expand-change="expandChange"><el-table-columntype="expand"width=""><templateslot-scope="scope">//渲染区</template></el-table-column></table> //定义一个 expandKeyId = undefined;expandChange...
背景：因为element里面的扩展行支持多行展示扩展行，但接到了需求，只能展示一行，如：第一行扩展，点击第二行的时候，第一行收起，第二行展开。同时改成点击行展示扩展内容 <el-table :data="eventTableData"style="width: 100%"cell-click="clickTable"ref="refTable"selection-change="handleSelect...
背景:因为element里面的扩展行支持多行展示扩展行,但接到了需求,只能展示一行,如:第一行扩展,点击第二行的时候,第一行收起,第二行展开。同时改成点击行展示扩展内容 <el-table :data="eventTableData" style="width: 100%" @cell-click="clickTable" ...
vueelementuitable表格展开⾏每次只展开⼀⾏需求：表格展开⾏每次只展开⼀⾏ <template> <el-table :row-key="getRowKeys":expand-row-keys="expands"@expand-change="expandSelect":data="neatingTableData"style="width: 100%"> <el-table-column type="expand"> <template slot-scope="props"> <...
el-table表格只展开一行(点击下一行上一行关闭),不是折叠,是打开和关闭 菜鸟也能高飞 67362116 发布于 2019-11-08 需求:点击其中一行的Edit按钮,打开编辑,再点击另一行的Edit按钮,上一行点过的会恢复回原先的状态,和其他行一样,类似反选,上下行切换。目的是想做到只可单行编辑,不能多行编辑。
一、el-table展开行(基础 可跳过) 参考element UI:Element - The world's most popular Vue UI framework 通过设置 type="expand" 和 Scoped slot 可以开启展开行功能,el-table-column 的模板会被渲染成为展开行的内容,展开行可访问的属性与使用自定义列模板时的 Scoped slot 相同。
下列列表是只可以展开一列的: 第一步: 直接抄我箭头指的那三行即可 :row-key=“(record) => record.id” 这个主要用于获取id @expand=“zi” 这个为了得到展开行的数据 :expandedRowKeys=“expandedRowKeys” 这个是负责控制行的展开与关闭,(这个变量是以数组的形式展示,谁的id在数组里就显示谁)...
最近要实现一个点击展开表格当前详细信息行的功能,element ui上有自定义的功能,但由于不能自定义展开的提示内容,就自己优化了一下 //行得显示与隐藏 toogleExpand(row) { let $table = this.$refs.table; this.…