Vue3 --- 在 v-for中获取DOM

206 阅读1分钟

一、示例一

1. template模板
    <div v-for="(item,index) in arr" :key="index">
        <span :ref="getDomRef">{{ item.name }}</span>
    </div>
    
2. <script setup></script>中
    const arr = ref(['这里是一段话'])
    const getDomRef = (el) =>{
      if(el){
        console.log(el);  // 获取 getDomRef DDOM
        myTextRef.value = el.innerHTML
        console.log(myTextRef.value);  // 输出 变量arr的值

        el.innerHTML = 'zhangliuwang'  //修改 DOM元素值
        console.log(el.innerHTML);  // 输出 修改后的值
      }
    }

二、注意

1.template中 ref用v-bing绑定