Cannot use v-for on stateful component root element because it renders multiple elements

问题代码

<template>
    <Tag v-for="dict in dicts" :key="`dict-tag-${dict.dictId}`" :name="dict.value" @click="handleChange(dict)">
        {{ dict.name }}
    </Tag>
</template>

修改后

<template>
    <div>
        <Tag v-for="dict in dicts" :key="`dict-tag-${dict.dictId}`" :name="dict.value" @click="handleChange(dict)">
            {{ dict.name }}
        </Tag>
    </div>
</template>

出错原因

组件template内部只能有一个元素,问题代码v-for循环后会出现多个,所以报错。最直观的解决办法就是在template内直接使用一个div包含所有的模板内容。

posted @ 2020-01-04 15:50  小方块的世界  阅读(1026)  评论(0编辑  收藏  举报