vue-virtual-scroll-list结合el-tree画指示线

682 阅读1分钟
  delArrItem(parent, num ,arr) {
      if (parent.nextSibling) {
          arr[num] = 'true';
      }else{
          arr[num] = 'false';
      }
      if (parent.parent) {
        num--;
        this.delArrItem(parent.parent, num,arr);
      }else{
        arr[arr.length - 1] = 'true'
        this.source['delItemFlag'] = arr
        return
      }
    }

 <div class="cell">
    <!--           -->
    <div
      v-for="(item,l) in source.level"
      class="l_bor1_box"
      v-show="source.level - 1 !== 0"
      :class=" source.delItemFlag && source.delItemFlag[l] == 'false'?'no_border':''"
      :style="{'left':`${l*18 + 5}`+'px'}"
      :key="l"
    >
      <!--  -->
    </div>
    <div
      class="el-tree-node"
<style lang="scss" scoped>
.cell {
  position: relative;
  .l_bor1_box {
    display: block;
    // width: 22px!important;
    height: 35px;
    border-right: 1px dotted #ccc;
    top: -18px;
    position: absolute;
    z-index: 998 !important;
  }
  .no_border {
    border-right: 1px dotted transparent;
  }
  .el-tree-node {
    flex: 1;
  }
}
</style>