重复组件槽

时间:2017-10-19 10:54:14

标签: javascript vue.js vuejs2 vue-component

我已经创建了一个组件,我想重复传递给它的内容重复“n”次。我试过这样做:

<template>
    <div>
        <slot v-for="n in amount"></slot>
    </div>
</template>

但是我在同一个渲染树中遇到错误“重复存在插槽”默认“ - 这可能会导致渲染错误。”

是否可以通过其他方式重复插槽内容?

编辑:为了进一步澄清,这就是我想要实现的目标:

我们说我有2个组件使用这些模板:

COMPONENT1:

<div>
    <h1>Hi</h1>
    <img src="hello.jpg">
</div>

组件2:

<div>
    <h2>Hello</h2>
</div>

我想要转到的模板是:

COMPONENT1:

<div>
    <div>
        <h1>Hi</h1>
        <img src="hello.jpg">
    </div>
    <div>
        <h1>Hi</h1>
        <img src="hello.jpg">
    </div>
    <div>
        <h1>Hi</h1>
        <img src="hello.jpg">
    </div>
</div>

组件2:

<div>
    <div>
        <h2>Hello</h2>
    </div>
    <div>
        <h2>Hello</h2>
    </div>
    <div>
        <h2>Hello</h2>
    </div>
</div>

0 个答案:

没有答案