在vuejs中,有没有办法不用复制粘贴就可以为多个slot设置相同的内容?
所以这样:
<base-layout>
<template slot="option">
<span :class="'flag-icon-' props.option.toLowerCase()" />{{ countriesByCode[props.option] }}
</template>
<template slot="singleLabel">
<span :class="'flag-icon-' props.option.toLowerCase()" />{{ countriesByCode[props.option] }}
</template>
</base-layout>
可以这样写:
<base-layout>
<template slot="['option', 'singleLabel']">
<span :class="'flag-icon-' props.option.toLowerCase()" />{{ countriesByCode[props.option] }}
</template>
</base-layout>
非常感谢。
最佳答案
您可以尝试使用 v-for
为此。
<base-layout>
<template :slot="slotName" v-for="slotName in ['option', 'singleLabel']">
<span :class="'flag-icon-' props.option.toLowerCase()" />{{ countriesByCode[props.option] }}
</template>
</base-layout>
参见 working example .
关于javascript - 多个模板插槽的相同插槽内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54090950/