vue3 获取 ref
vue3 获取 ref
·
循环里使用 async await
async fn(){
for (let item of arr){
await 请求
}
}
<!-- vue3 中获取ref -->
<!-- <template>
<div ref='divDom'></div>
</template>
<script setup>
import { ref} from 'vue'
const divDom = ref(null);
onMounted(()=>{
console.log('获取dom元素',divDom)
}) -->
<!-- vue3 在循环中获取 ref -->
<template>
<div v-for="(item,index) in list" :key="index" :ref="setItemRef">
{{item}}
</div>
<el-button @click="getRefData">获取</el-button>
</template>
<script setup>
import {ref,reactive} from 'vue'
const refList = ref([]) ; //定义ref数组
const list = reactive([
"第一行数据",
"第二行数据",
"第三行数据",
"第四行数据",
])
//赋值ref
const setItemRef = el => {
if (el) {
console.log(el,'----el');
refList.value.push(el);
}
}
//获取ref并执行接下来操作
const getRefData = ()=>{
console.log('sss');
for(let i =0; i < refList.value.length; i++){
console.log(refList.value[i]); // refList.value[i].xxx 执行todo
}
}
</script>
更多推荐
所有评论(0)