總結在vue中遇見的一系列錯誤並給出解決方法，持續更新...

在vue檔案中寫了script標籤對而不宣告export default {} 將會報此錯誤，如：

<template>
</template>

<script>
</script>

<style lang="stylus" type="text/stylus" scoped>
</style>

解決方法：

<template>
</template>

<script>
export default {
}
</script>

<style lang="stylus" type="text/stylus" scoped>
</style>
 

2.Error in render: "TypeError: Cannot read property '0' of undefined"

在做父元件向子元件傳遞資料時報錯，情況如下：

  // 父元件
  data () {
    return {
      seller: {}
    }
  },
  created () {
    axios.get('/api/seller') // 非同步獲取資料
      .then((resp) => {
        if (resp.data.errno === ERR_OK) {
          this.seller = resp.data.data
        }
      })
  }
 

// 子元件
<div class="support">
    <span class="icon"></span>
    <span class="text">{{seller.supports[0].description}}</span>
</div>

報錯原因：因為父元件的seller資料是非同步獲取的，初始值為空，子元件在開始使用seller時是沒有資料的。

解決方法：在子元件上加上v-if="seller"屬性，在seller不為空時在顯示div