>[info] 在vue2中v-for循環的ref會自動綁定到ref數組中，在vue3中需要手動綁定
```
<template>
<div>
<img alt="Vue logo" src="./assets/logo.png" />
<HelloWorld msg="Hello Vue 3 + Vite" />
<div v-for="item in list" :ref="setItemRef">
{{ item }}
</div>
</div>
</template>
<script >
import { ref } from "vue"
import HelloWorld from "./components/HelloWorld.vue";
//引入生命周期
import { onBeforeUpdate, onUpdated, onMounted } from 'vue'
//ref相當于vue2的data中的變量
//vue3 在循環中綁定的ref需要手動綁定到數組中，(vue2自動綁定到數組中)
export default {
components: { HelloWorld },
setup() {
let itemRefs = []
const list = ref(['1', '2', '3']);
//方法
const setItemRef = el => {
if (el) {
itemRefs.push(el)
}
}
onMounted(()=>{
console.log(itemRefs[0])
})
//在模版更新之前
onBeforeUpdate(() => {
itemRefs = []
})
//輸出方法給模版使用
return {
setItemRef,
list
}
}
}
</script>
```
