如何从组件中的每个v-for项中获取droptable数据？

<template>
  <div>
    <div v-for="item in items" :key="item.id">
      <p>{{ item.name }}</p>
      <p>{{ getDropTableData(item.id) }}</p>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { id: 1, name: 'Item 1' },
        { id: 2, name: 'Item 2' },
        { id: 3, name: 'Item 3' }
      ],
      dropTables: [
        { id: 1, data: 'DropTable 1' },
        { id: 2, data: 'DropTable 2' },
        { id: 3, data: 'DropTable 3' }
      ]
    };
  },
  methods: {
    getDropTableData(itemId) {
      const dropTable = this.dropTables.find(table => table.id === itemId);
      return dropTable ? dropTable.data : '';
    }
  }
};
</script>