直入正題,不廢話!
使用Vue渲染列表是很簡單方便的,但如果需要在渲染item的時候去監(jiān)聽事件就無法實現(xiàn)了,樓主我翻遍了Vue的api也沒找到合適的方法去解決,其中也提到使用watch和vue.nextClick 監(jiān)聽,但這些都不能實現(xiàn),苦惱啊,不過機(jī)智的我還是想到了曲線救過的方法,利用過濾器來實現(xiàn),代碼如下
<li v-for="item in list"> {{item.content | setEvent item.id , item.name}}</li> new Vue({ el:'', data:{ list:[] }, fliters:{ setEvent:function(content , id , name) { // TODO 處理你的事件。。 return content ; } } })
過濾器函數(shù)始終以表達(dá)式的值作為第一個參數(shù)(item.content)。
帶引號的參數(shù)視為字符串,而不帶引號的參數(shù)按表達(dá)式計算。這里將表達(dá)式 item.id 將傳給過濾器作為第二個參數(shù),表達(dá)式 item.name 的值在計算出來之后作為第三個參數(shù)。
注意一定要return 當(dāng)前l(fā)i需要顯示的內(nèi)容,否則li無數(shù)據(jù)展示,這樣就可以實現(xiàn)監(jiān)聽列表item的的渲染事件,厲害不!哈哈哈!
以上這篇Vue 監(jiān)聽列表item渲染事件方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
聲明:本網(wǎng)頁內(nèi)容旨在傳播知識,若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
本文如未解决您的问题请添加抖音号:51dongshi(抖音搜索懂视),直接咨询即可。