• (ref)vue遍历ref或动态或多层遍历动态ref


    <el-input
     ref="'workedInfoRef' + scope.$index" //scope.$index如果是for循环可以是index,这里用了el-table的index
    ></el-input>
    //获取
    this.$refs[`workedInfoRef${i}`];
    //input手动焦点
    this.$refs[`workedInfoRef${i}`].focus();

    如果是for循环直接遍历,下面的ref是个数组

    <li v-for="(list, index) in tagList" :key="index" ref="tagItem">{{list.value}}</li>
    this.$refs.tagItem[0].style.backgroundImage = `url(${xxx})`

    双层for循环遍历

    三. 双循环动态设置ref
    设置【:ref="‘xxx’+id"】或【:ref="‘xxx’+index"】
    <div v-for="(item,index) in topicList" :key="index">
          <el-carousel-item v-for="(son,i) in item.questionList" :key="index+i">
               <topic :ref="'topicRef'+son.bId"></topic>
               //或也可以用索引.  用一个索引会重复,如下
               //<topic :ref="'topicRef'+(i+index)"></topic>
          </el-carousel-item>
    </div>
    
    获取
            eval("that.$refs.tagItem" +(x+index))[0]
            或
            eval("that.$refs.topicRef" +(ele.bId))[0]
  • 相关阅读:
    Execution Contexts (执行上下文)
    OOP—ECMAScript实现详解
    requireJS入门
    SqlServer 傲娇的表变量
    CSharp进阶 引用类型引发的血案
    CSharp进阶 都是请求惹的祸
    z-index问题
    js中事件(自定义事件)
    做了个后末日朋克风的梦
    昨晚的梦
  • 原文地址:https://www.cnblogs.com/dianzan/p/14280592.html
Copyright © 2020-2023  润新知