• 因?yàn)楦刂荒苡幸粋€(gè)，所以v-for放在根元素上Vue會(huì)不知道怎么渲染
  這樣寫會(huì)報(bào)錯(cuò):

<template v-for="product in productList">
  <div class="main_left" >
    <div class="product_list">
      <h3>全部產(chǎn)品</h3>
      <ul class="list">
        <li>{{ product.title }}</li>
        <li v-for="item in product.list">
          <a :href="item.url">{{ item.name }}</a>
          <span v-if="item.hot" class="hot_if"></span>
        </li>
      </ul>
      <div v-if="!product.last" class="hr"></div>
      <ul class="list">
        <li>手機(jī)應(yīng)用類</li>
      </ul>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
       productList: {
        ...
       }
      }
    }
  }
</script>

一般正確寫法：

<template>
  <div class="index-wrap">
    <div class="index-left">
      <div class="index-left-block">
        <h2>全部產(chǎn)品</h2>
        <template v-for="product in productList">
          <h3>{{ product.title }}</h3>
          <ul>
            <li v-for="item in product.list">
              <a :href="item.url">{{ item.name }}</a>
              <span v-if="item.hot" class="hot-tag">HOT</span>
            </li>
          </ul>
          <div v-if="!product.last" class="hr"></div>
        </template>
      </div>
    </div>
  </div>
</template>