element-ui table表格组件实现手风琴效果

一、前言 百度上到的实现多多少少有点瑕疵,要么只能实现默认展开,要么不能实现,要 么总会有一行是展开状态,所以自己想办法解决了这个问题。 二、代码 首先,核心代码

三、解释 expand-change事件会监听table expand行发生变化时触发,无论展开还是关闭,这就很烦,他会返回2个默认参数,一个是当前行,二个是当前展开的行的集合数组,所以这里我用第二个参数的长度是否大于1来识别是否有多个展开,如果是,则过滤关闭其他行,这里使用table的自带方法toggleRowExpansion,第二个参数传入false,则关闭第一个参数当前行

转载于:https://juejin.im/post/5c4675136fb9a049c965ff30

你可能感兴趣的:(element-ui table表格组件实现手风琴效果)