美文网首页
element-ui表格全部折叠功能

element-ui表格全部折叠功能

作者: 陌客百里 | 来源:发表于2019-03-11 16:40 被阅读0次

给el-table一个ref,这里给一个project,
通过原理我们知道,在点击展开的时候el-table会调用某个函数,来操作展开,而el-table中展开的词是,expended,通过expended这个词,全局搜索找源码找到了绑定展开按钮的函数handleExpendClick(),而这个函数里有调用了this.store.toggleRowExpansion(row)这个函数,而row是什么呢?我们根据点击事件调用的地方,又找到了row其实存储在store.states.expandrows中,因此只要遍历expandrows这个数组,取出里面的row,传递给toggleRowExpansion函数就行,但最后遇到一个坑,就是普通循环是顺序执行的,会触发页面刷新,而第二次执行由于此时页面在刷新,没有响应,因此还需要加一个settimeout进行异步调用。

代码:

for(let row of this.$refs.project.store.states.expandRows){
        setTimeout(_=>{
            this.$refs.subejct.store.toggleRowExpansion(row);
},200)
}

相关文章

网友评论

      本文标题:element-ui表格全部折叠功能

      本文链接:https://www.haomeiwen.com/subject/ddpbpqtx.html