TypeError: Cannot read property 'length' of undefined
    at Proxy.render (eval at ./node_modules/cache-loader/dist/cjs.js?
{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"70de47a1-vue-loader-
template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-
loader/dist/cjs.js?!./node_modules/vue-
loader/lib/index.js?!./src/views/Detail/childdetail/DetailGoodNote.vue?
vue&type=template&id=73e21576& (2.js:93), <anonymous>:13:42)

這是因?yàn)楫惒郊虞d數(shù)據(jù)沒有加載完，就在組件使用length屬性，此時(shí)data數(shù)據(jù)為空，導(dǎo)致的錯(cuò)誤

解決的方式：

在最外面的div使用vif做一個(gè)判斷，如果這個(gè)data屬性有值，才執(zhí)行渲染html元素
對象可以使用object.keys（obj）來判斷是否有值

<template>
 <div v-if="Object.keys(Gooddetailnote).length !== 0">  <!-- 判斷是否有值才渲染下面的html -->
    <h1>{{ Gooddetailnote.title }}</h1>
    <div>{{ Gooddetailnote.price }}</div>
    <div>
      <span>
        {{ Gooddetailnote.columns[0] }}
      </span>
      <span>
        {{ Gooddetailnote.columns[1] }}
      </span>
      <span>{{ Gooddetailnote.services[Gooddetailnote.services.length-1].name }}</span>
    </div>
    <div>
      <span v-for="index in Gooddetailnote.services.length-1" :key="index">
        <img :src="Gooddetailnote.services[index].icon" alt="" />
        {{ Gooddetailnote.services[index].name }}
      </span>
    </div>
  </div>
</template>