只需像:ref="'element' + result.id"或ref="element${result.id}"那样使用虚拟绑定。
检查fiddle here。“

new Vue({
  el: '#app',
  data: {
    data: [{id: 1}, {id: 2}, {id: 3}],
  },
  mounted() {
    console.log(this.$refs);
  }
})

个字符
编辑：感谢Vamsi的编辑，我用result.id替换了index
编辑8/28：感谢grokpot，我添加了一个由Template literal提供支持的示例。

使用v-bind:ref或:ref。
下面是一个简单的示例，包括如何访问动态ref

<template>
    <div>
        <div class="inputs" v-for="input in inputs" :key="input.id">
            <input type="text" v-model="input.name" :ref="'name' + input.id">
            <button @click="displayRef('name' + input.id)">
                 Click to see the input ref
            </button>
            <hr>
            <button @click="displayAllRefs">Click to see all refs</button>
        </div>
    </div>
</template>

字符串
还有剧本：

<script>
    export default {
        data() {
            return {
                inputs: [
                    { id: Date.now(), name: '', lastName: '' }
                ]
            }
        },
        methods: {
            displayRef(ref) {
                console.log(this.$refs[ref]) // <= accessing the dynamic ref
                console.log('The value of input is:',this.$refs[ref][0].value) //<= outpouting value of input
            },
            displayAllRefs() {
                console.log(this.$refs)
            }
        }
    }
</script>

型

你有动态的引用和多个元素。

new Vue({
      el: '#app',
      data: {
        data: [{id: 1}, {id: 2}, {id: 3}],
      },
       methods: {
      addNewClass(index) {
      
      this.$refs.element[index].classList.add('custom-class')
    }
  },
    
    })

个字符

Vue 3.2.47+的更新：如果你特别需要访问v-for的元素，你可以直接将ref附加到一个数组：（docs）.示例代码

<script setup>
// ...
const itemRefs = ref([]);
</script>

<template>
  <Comp v-for="item in list" ref="itemRefs">
    {{ item }}
    {{ itemRefs[2] }}
  </Comp>
<template>

字符串
如果您的v-for是一个自定义组件列表，请确保使用defineExpose对expose any fields or functions you need进行操作。
如果你还需要引用列表保持相同的顺序，我发现this answer非常有用。