js,element ui 相关问题

js相关问题

我在页面上一开始有8个div,我的代码通过这2种方式可以实现对应的功能

方法一:
new Vue({
el: '#b-leftcol', 
    mounted(){
        document.addEventListener('mouseup',()=>{
        for(var a=1;a<=count;a++)
        {
         
         var x='treeMenuRef'+a;
         console.log(x);
         this.$refs[x].style.display= "none";
        }

      }) 


    },

方法二:
        for(var i=0;i<=num;i++)
        {
          if(node.level==2 && nodeData.label==MenuArray[i]){
          var x=i+1;
          var treeId='treeMenuRef'+(x);        
          if(rows[i]>1){
          increase=rows[x]-1;
          var treecss=document.getElementById(x);
          var px = 40 + increase * 30;
          treecss.style.height=px+'px';   
        }
          //console.log(event,nodeData);

          this.$refs[treeId].style.display = "block";
          this.$refs[treeId].style.top  = event.pageY  + "px";
          this.$refs[treeId].style.left = event.pageX+ "px";

          break;
        }

以上2种方法都是可以正常使用的,但是后来因为我想使用element ui的Drawer,(你要使用element ui不得给他一个div包起来么?)所以,我现在给那8个div外面加了一个大的div,然后执行就会发现这2个地方报错

img

我理解是不是要先获取大的div 然后在循环获取原来的8个div,但是又不知道如何下手,也不知道理解对不对
所以向各位请教。谢谢各位的不惜赐教,好人一生平安

img

我意思就是 addEventListener 和 document.getElementById() 之前获取黑色的div是没问题的,现在我外面加了一个蓝色的div就不行了

elementui的弹窗组件和抽屉组件都是异步组件,
其一有加载顺序,这种确保页面渲染了再做其他操作
其二如果给加了append-to-body这个属性,他的父节点有可能就不是你给的那个大div了,而是最外层的body

没明白你的意思,建议题主把html结构代码贴出来

你打印一下你 $refs 拿到东西没有,怀疑是 null || undefined 才会出这个错

先获取蓝色div 可以给他加个 id 或者class ,然后获取 其子元素再循环