如何使用v-for为多个插槽创建插槽内容

<!-- 父组件 -->
<template>
  <div>
    <child-component>
      <template v-for="(item, index) in slotContents" v-slot:[`slot-${index}`]>
        {{ item }}
      </template>
    </child-component>
  </div>
</template>

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

export default {
  components: {
    ChildComponent,
  },
  data() {
    return {
      slotContents: ['插槽1', '插槽2', '插槽3'],
    };
  },
};
</script>

<!-- 子组件 -->
<template>
  <div>
    <slot name="slot-0"></slot>
    <slot name="slot-1"></slot>
    <slot name="slot-2"></slot>
  </div>
</template>

<script>
export default {
  // 子组件的其他逻辑
};
</script>