vue项目中循环遍历公共组件，怎么获取公共组件中的数据

在 Vue 中，可以使用 props 将数据从父组件传递到子组件中，以便在子组件中使用。如果您想要从公共组件中获取数据，您可以将数据作为 props 传递给公共组件，并在公共组件中使用这些 props。

例如，在您的 Vue 项目中，您可能有一个名为 `MyComponent` 的公共组件，它接收一个名为 `items` 的数组作为 props。您可以在父组件中循环遍历 `MyComponent` 并将 `items` 数组传递给每个实例。然后，在 `MyComponent` 中，您可以使用 `props` 对象来访问 `items` 数组数据。

示例代码如下：

<!-- 父组件 -->
<template>
  <div>
    <MyComponent v-for="item in items" :items="item" :key="item.id"></MyComponent>
  </div>
</template>

<script>
import MyComponent from './MyComponent.vue';

export default {
  name: 'ParentComponent',
  components: {
    MyComponent
  },
  data() {
    return {
      items: [
        { id: 1, name: 'item1' },
        { id: 2, name: 'item2' },
        { id: 3, name: 'item3' }
      ]
    }
  }
}
</script>

<!-- 子组件 -->
<template>
  <div>
    <ul>
      <li v-for="item in items" :key="item.id">{{ item.name }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'MyComponent',
  props: {
    items: {
      type: Array,
      required: true
    }
  }
}
</script>

在上面的代码中，父组件循环遍历 `MyComponent` 并将 `items` 数组作为 props 传递给每个实例。在子组件中，我们使用 `props` 对象来定义 `items` 数组，并在模板中使用它来显示数据。