elementui table组件 数形数据 点击行 展开数据

2020-12-30  本文已影响0人  混水妹妹
image.png
https://element.eleme.cn/#/zh-CN/component/table
elemenui默认是点击红包展开箭头展开行,那么当leader要求你点击一行 就要展开数据了呢
直接上代码!
在封装的组件(子组件)那设置方法
  // 点击行 展开树形表格
    bindTableOpenHandler (elRef) {
      const tbody = elRef.getElementsByTagName('tbody')[0]
      const trs = tbody.getElementsByTagName('tr')
      const arrTrs = Array.from(trs)
      for (let i = 0; i < arrTrs.length; i++) {
        const icon = arrTrs[i].querySelector('.el-table__expand-icon')
        if (arrTrs[i].style.display !== 'none') {
          arrTrs[i].onclick = () => {
            icon && icon.click()
          }
        }
      }
    }

父组件 渲染表格数据完成后 调用

 this.$nextTick(()=>{
   this.$refs.treeTable.bindTableOpenHandler(this.$refs.treeTable.$el) // 点击表格行展开树形表格
 })
上一篇下一篇

猜你喜欢

热点阅读