1. 程式人生 > >Cannot use v-for on stateful component root element because it renders multiple elements.

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

報錯如圖提示:

 Cannot use v-for on stateful component root element because it renders multiple elements.中文大致意思:不能在根元素(root element)使用 v-for,因為v-for是個迴圈體呈現多個元素,v-for在根元素上導致無法渲染。

程式碼如圖:

<template>
  <div v-for="(item,index) in headerList" v-on:click="selectMainTheme(index)">
    <a href="java:;" :class="{'active':idx == index}">{{item.name}}</a>
  </div>
</template>

修改後程式碼:

<div class="contain">
    <div v-for="(item,index) in headerList" v-on:click="selectMainTheme(index)">
      <a href="java:;" :class="{'active':idx == index}">{{item.name}}</a>
    </div>
  </div>