<template>
<ul>
<li v-for="(item, index) in arr"
:key="index"
:ref="el => setRef[index] = el">
{{ item }}
</li>
</ul>
<div ref="single">我是单个dom</div>
</template>
<script>
import { ref, nextTick, onMounted,onBeforeUpdate,onUpdated } from 'vue'
export default {
name: 'nnnn',
components: {},
computed: {},
watch: {
curData(newValue) {
console.log(newValue)
this.$nextTick(() => {
this.moveFun(newValue)
})
},
},
methods: {
changeMsg() {
this.$nextTick(() => {
})
}
},
setup() {
const arr = ref([1, 2, 3])
const setRef = ref([])
const single = ref(null)
const moveFun = () => {
nextTick(() => {
console.log('[[[[[[[]]]]]]]', setRef.value)
})
}
nextTick(() => {
console.log('循环dom----',setRef.value)
console.log('循环dom第一个----',setRef.value[0])
console.log('循环dom最后一个----',setRef.value[setRef.value.length-1])
console.log('单个dom----',single.value)
})
onMounted(() => {
})
onBeforeUpdate(() => { })
onUpdated(() => { })
return {
arr,
setRef,
moveFun,
}
},
}
</script>
<style lang="scss">
</style>
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步