鍍金池/ 問(wèn)答/Android  HTML/ 使用vuejs時(shí)，如何正確獲取v-for循環(huán)出來(lái)的元素。

使用vuejs時(shí)，如何正確獲取v-for循環(huán)出來(lái)的元素。

1.使用v-for循環(huán)得到的列表<li>元素，想要通過(guò)監(jiān)聽(tīng)mouseover和mouseout兩個(gè)事件來(lái)對(duì)劃過(guò)的<li>元素的樣式進(jìn)行修改，但是在方法中使用this無(wú)法正確獲得我需要元素。比如我在methods中定義的方法showUp，并且在data中已經(jīng)給每個(gè)<li>元素定義了pageup屬性，但是在showUp中打印pageup的結(jié)果是undefined，這是為什么？求高手解釋下！
2.代碼如下：
clipboard.png

clipboard.png

clipboard.png

3.結(jié)果如下：

clipboard.png

回答
編輯回答
葬愛(ài)

showUp函數(shù)里面的this ,指向的是 當(dāng)前vue實(shí)例，可以獲取到 this.pageitems 整個(gè)數(shù)組

雖然 給每個(gè)<li>元素定義了pageup屬性，但是沒(méi)有給對(duì)應(yīng)的li 元素添加對(duì)應(yīng)的屬性

@mouseover = showUp(item),這里傳入item，就可以拿到 item.pageup屬性了。

2017年1月29日 02:59
編輯回答
櫻花霓

showUp:function(val) {

console.log(this.pageitems[val].pageup)
}

2017年4月20日 21:12
編輯回答
旖襯

你把data對(duì)象定義成數(shù)組,肯定得數(shù)組[索引]里的json[key]才能獲得啊

clipboard.png

clipboard.png

2018年5月20日 02:05
編輯回答
魚(yú)梓

建議多看看文檔 this指向的是vue實(shí)例 this.a 是return里面的變量

2017年7月6日 05:34
編輯回答
薄荷糖

感覺(jué)你沒(méi)思考過(guò)，打印下this，看看輸出，思考一分鐘，如果還是想不通，再來(lái)問(wèn)。

2017年1月23日 14:19
編輯回答
汐顏

這個(gè)肯定獲取不到?。?br>改寫showUp,傳入index
showUp(index) {

console.log(this.pageitems[index].pageup)

}
你再看看

2018年2月11日 19:12