举例说明，用vue实现父组件使用循环遍历触发事件，子组件动态展示父组件触发事件产生的数据

下面是一个示例，展示如何使用Vue实现父组件使用循环遍历触发事件，子组件动态展示父组触发事件产生的数据：

父件（Parent.vue）中使用v-for指循环遍历数据，并在点击按钮时触发自定义事件，并传递数据给子组件：

<template>
  <div>
    <button v-for="item in items" :key="item.id" @click="handleClick(item)">
      {{ item.name }}
    </button>
    <Child :data="selectedData" />
  </div>
</template>

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

export default {
  components: {
    Child,
  },
  data() {
    return {
      items: [
        { id: 1, name: 'Item 1' },
        { id: 2, name: 'Item 2' },
        { id: 3, name: 'Item 3' },
      ],
      selectedData: null,
    };
  },
  methods: {
    handleClick(item) {
      this.selectedData = item;
    },
  },
};
</script>

子组件（Child.vue）接收父组件传递的数据，并动态展示：

<template>
  <div>
    <h2>子组件</h2>
    <div v-if="data">
      <p>ID: {{ data.id }}</p>
      <p>Name: {{ data.name }}</p>
    </div>
    <div v-else>
      <p>未选择任何数据</p>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    data: {
      type: Object,
      default: null,
    },
  },
};
</script>

在上述示例中，父组件中的items数组通过v-for指令进行循环遍历，每个按钮都绑定了点击事件，点击按钮时会调用handleClick方法，并将对应的数据项作为参数传递进去，然后将选中的数据赋值给selectedData。

子组件中通过props接收父组件传递的data，并根据data是否为null来动态展示不同的内容。

这样，当在父组件中点击不同的按钮时，子组件会根据传递的数据动态展示对应的内容。你可以根据需要修改数据和显示方式，以及自定义组件的样式和行为。