vue3-- setup中獲取數組dom

<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(() => { // this.msg2 = this.$refs.msgDiv.innerHTML }) } }, setup() { const arr = ref([1, 2, 3]) //測試數據 const setRef = ref([]) // 存儲dom數組。// 初始值變量名一定要和模版中的ref一致，比如此處為 setRef const single = ref(null) //初始值需要賦值為空，或者null，初始值變量名一定要和模版中的ref一致，比如此處為 single const moveFun = () => { nextTick(() => { console.log('[[[[[[[]]]]]]]', setRef.value) }) } nextTick(() => { console.log('循環dom----',setRef.value) //數組渲染后輸出Proxy{0: li, 1: li, 2: li} console.log('循環dom第一個----',setRef.value[0]) console.log('循環dom最后一個----',setRef.value[setRef.value.length-1]) console.log('單個dom----',single.value) }) onMounted(() => { //dom渲染完后 執行 }) onBeforeUpdate(() => { }) onUpdated(() => { }) return { arr, setRef, moveFun, } }, } </script> <style lang="scss"> </style>