v-for引用自定义组件

当使用v-for指令循环渲染自定义组件时，需要注意以下几点：

1.在自定义组件中，需要使用props来接收父组件传递的数据。

2.在v-for指令中，需要为每个组件设置一个唯一的key值，以便Vue能够正确地跟踪每个组件的状态。

下面是一个使用v-for指令循环渲染自定义组件的示例：

<template>
  <div>
    <custom-component v-for="(item, index) in items" :key="index" :item-data="item"></custom-component>
  </div>
</template>

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

export default {
  components: {
    CustomComponent
  },
  data() {
    return {
      items: [
        { name: 'Apple', price: 2.5 },
        { name: 'Banana', price: 1.5 },
        { name: 'Orange', price: 3 }
      ]
    }
  }
}
</script>

在上面的示例中，我们使用v-for指令循环渲染了一个自定义组件CustomComponent，并将每个组件的数据通过props传递给了CustomComponent组件。同时，我们为每个组件设置了一个唯一的key值，以便Vue能够正确地跟踪每个组件的状态。