如果沒有禮物的話，商品與商品之內(nèi)+按鈕是正常的，但突然后面有了+按鈕，這樣是不應該的。如何怎么刪除后面+按鈕呢？jsfiddle：鏈接描述

有問題如下：

我想要的效果就是：

JavaScript：

var app = new Vue({
  el: "#app",
  data: {
    list: [{
      id: 1,
      name: 'A',
      goods: [{
        name: "goods_a1"
      }],
      gift: [{
        name: "gift_a1",
      }]
    }, {
      id: 2,
      name: 'B',
      goods: [{
        name: "goods_b1"
      }, {
        name: "goods_b2"
      }],
    }, {
      id: 3,
      name: 'C',
      goods: [{
        name: "goods_c1"
      }, {
        name: "goods_c2"
      }, {
        name: "goods_c3"
      }],
      gift: [{
        name: "gift_c1",
      }]
    }]
  }
})

HTML:

<div id="app">
  <div class="mui-row" v-for="item in list">
    <div class="span-title-main">
      <span class="span-title">{{item.name}}</span>
    </div>
    <br>
    <ul>

      <li>
        <div class="mui-col" v-for="items in item.goods">
          <span class="span-name">{{items.name}}</span>
          <div class="addspan">+</div>
        </div>

        <div class="mui-col" v-for="itemss in item.gift">
          <span class="span-name">{{itemss.name}}</span>

        </div>

      </li>
    </ul>
  </div>
</div>