在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ v-for讀取深層數(shù)據(jù)出錯

v-for讀取深層數(shù)據(jù)出錯

這是pug代碼

ul  
        li(v-for="item in data")
            img.cover(:src="item.cover.url")
            span.title {{ item.title }}
            span.rating-value {{item.cover.url }}
            span.directors 導演:
                span(v-for="i in item.directors") {{ i }}
            span.actors 主演:
                span(v-for="i in item.actors") {{ i+' / ' }}
            span.rating-count(v-text="item.hello ") 人看過
            span.booking 購票

這是數(shù)據(jù)對象

data = [
    {
      "original_price": null,
      "rating": {
        "count": 29470,
        "max": 10,
        "value": 6.2
      },
      "actions": [
        
      ],
      "year": "2017",
      "card_subtitle": "2017 / 中國大陸 / 喜劇 愛情 / 田羽生 / 韓庚 鄭愷",
      "id": "26662193",
      "title": "前任3:再見前任",
      "label": null,
      "actors": [
        "韓庚",
        "鄭愷",
        "于文文"
      ],
      "type": "movie",
      "forum_info": {
        "id": "movie/26662193",
        "participant_count": 1495,
        "uri": "douban://douban.com/movie/26662193/forum_topics"
      },
      "description": "",
      "price": null,
      "date": null,
      "info": "中國大陸 / 喜劇 愛情 / 田羽生 / 韓庚 鄭愷",
      "url": "https://www.douban.com/doubanapp/dispatch?uri=/movie/26662193/",
      "release_date": "12.29",
      "cover": {
        "url": "https://img1.doubanio.com/view/photo/m_ratio_poster/public/p2508926717.webp",
        "width": 1001,
        "shape": "rectangle",
        "height": 1500
      },
      "uri": "douban://douban.com/movie/26662193",
      "subtype": "",
      "directors": [
        "田羽生"
      ],
      "reviewer_name": "",
      "null_rating_reason": ""
    },
    {...},
    {...},
    {...}
]

如圖,item.cover.url可以獲取,但是同樣的item.rating.value就報錯了

回答
編輯回答
我甘愿

初始化問題
因為還沒有取到值
頁面先渲染
對象里面的屬性沒有值得話會返回undefined;
你說的深層次數(shù)據(jù)化的話 就是指的undefined;
undefined的是沒有屬性的話會報錯;
vue里面是一直監(jiān)聽頁面;
當你取到所有數(shù)據(jù)的時候,也就會渲染頁面了;
但是報錯是你沒有取到數(shù)據(jù)的時候顯示的;

2018年7月15日 16:03
編輯回答
檸檬藍

最后一張圖弄嗝清楚的上傳

2018年7月4日 06:51
編輯回答
笨尐豬

這好像是vue的一個小bug,處理三級json的時候會出現(xiàn)這個問題,你可以加個v-if判斷,如:

<div v-if="item.a.b">{{item.a.b.c}}</div>
2017年12月4日 19:46