父级列表页，将列表项做成自定义组件，监听子组件的click事件，获取当前子组件实例绑定的数据。
发现前10个子组件实例触发click时，console.log能正确输出该组件绑定的数据，但是后续的子组件实例触发click时输出的并非该组件绑定的数据。

附上代码

父组件：

<card v-for="(item, index) in listData" :data="item" :key="index"></card>

子组件：

<template>
  <div class="component-card" @click="cardClick”>{{ data.name }}</div>
</template>

<script>
export default {
  props: {
    data: {
      type: Object,
      default: {}
    }
  },
  methods: {
    cardClick () {
      console.log(`card click: ${this.data.name} (${this.data.id})`)
    }
  }
}
</script>

附上列表项依次点击前20项输出截图