vue列表渲染時(shí)綁定v-if條件渲染獲取對象屬性報(bào)錯(cuò)

解析出來的json對象：

"activity": {
        "num": 0,
        "items": []
    },
    data類數(shù)組對象下每個(gè)子對象包含一個(gè)activity屬性

vue循環(huán)綁定v-if：

/*html大致就是這樣一個(gè)結(jié)構(gòu)*/
<ul>
    <li v-for="(item,index) in list">
        ...
        <p v-if="item.activity.num!=0">123</p>
    </li>
</ul>
/*數(shù)據(jù)結(jié)構(gòu)*/
data:[{
    ...
    "activity": {
        "num": 0,
        "items": []
    },
},
{
    ...
    "activity": {
        "num": 0,
        "items": []
    },
}
]

v-if="item.activity.num"http://這里就會報(bào)錯(cuò)


//vue.js:491 [Vue warn]: Error in render: "TypeError: Cannot read property 'num' of undefined"

//(found in <Root>)


what FFFFFFF!

最神奇的是我直接在js中獲取：

var a = vm.list[0].activity.hasOwnProperty("items"); 
                                console.log(a);//true
//或者
console.log(vm.list[0].activity.num);//0
//可以看出來是能夠正常獲取到的

如上注釋，明明是可以獲取到的屬性，為何循環(huán)時(shí)條件渲染會報(bào)錯(cuò)？
請大神賜教！

回答

編輯回答

情皺

你得好好看看教程。。。
如果你沒有事先定義 data 的屬性
比如你這里的 data.list
那么你后面再 vm.list = listFromAPI
Vue 是不能檢測對象屬性的添加或刪除的

https://cn.vuejs.org/v2/guide...

2017年3月20日 14:30

編輯回答

笑忘初

你的截圖看不到。。
猜測：
你的數(shù)據(jù)是請求回來的，所以組件一開始渲染的時(shí)候數(shù)據(jù)沒有回來導(dǎo)致報(bào)錯(cuò)

看到了，num不能在undefined上那個(gè)。很明顯了。你的activity是沒有存在在item上的。你仔細(xì)看下代碼，執(zhí)行v-if的item.activity.num時(shí)候，確保activity在item上

2018年8月13日 18:24

編輯回答

凝雅

可否把代碼貼完整這個(gè)item 是在哪v-for 出來的 v-for的哪個(gè)數(shù)據(jù)

你這data定義是一個(gè)數(shù)組你就循環(huán)data可好 list 哪來的

2017年10月16日 02:50

編輯回答

祉小皓

多半是異步取數(shù)據(jù)的問題,你這問題就這點(diǎn)代碼不好回答啊

2018年9月5日 13:18

編輯回答

拮據(jù)

看不全。也是猜測

v-if="item.activity.num"http://這里就會報(bào)錯(cuò)

var a = vm.list[0].activity.hasOwnProperty("items"); 
                                console.log(a);//true
//或者
console.log(vm.list[0].activity.num);//0

你上面寫的是item.activity.num 但是下面寫的是vm.list[0].activity.num 數(shù)據(jù)沒有對應(yīng) 不知道你v-if上面是不是有v-for循環(huán) 建議把問題部分貼全

2018年8月17日 14:37