vue在列表遍历时,dom出现"undefined"

Question

<template v-for="(item,n) in photoList">
    <template v-if="n%2==0">
      <div class="floor-info" :class="{mt0:n==0}">
        {{null== layout ? '' : layout[n].name}}/{{null== layout ? '' : layout[n+1].name}}
      </div>
    </template>
    <div class="block" :class="{ml:n%2==0}" @click="goDesignerEvent(n)">
      <div class="edit" href="javascript:;" :data-page="n" :style="{height:getPageHeight(n)}">
        <div class="pageDiv">
          <div class="templateDiv" :style="templateStyle(n)"></div>
          <!-- 这里是重点-->
          <template v-for="(imageItem,imageIndex) in item.list">
            <div class="photoDiv" :style="photoItemStyle(n,imageIndex)"></div>
          </template>
        </div>
      </div>
    </div>
</template>

item.list是一个数组类型,默认为[];
在vue2.4.2的版本下当item.list=[]时,遍历出的DOM竟然显示undefined?

请问这是为什么呢,空数组不应该默认不进行遍历么?

Answer 1

这个是vue之前的一个bug
解决办法：把vue版本更新到最新即可。
详细信息：https://github.com/vuejs/vue/...

Answer 2

空数组是不会渲染的，应该是list的问题

Answer 3

我也遇到这个问题，把空数组置为null,或者undefined，就没有这个多余的东西。