Vue 監聽列表item渲染事件方法

直入正題，不廢話！

使用Vue渲染列表是很簡單方便的，但如果需要在渲染item的時候去監聽事件就無法實現了，樓主我翻遍了Vue的api也沒找到合適的方法去解決，其中也提到使用watch和vue.nextClick 監聽，但這些都不能實現，苦惱啊，不過機智的我還是想到了曲線救過的方法，利用過濾器來實現，代碼如下

<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 ; 
 }
 }
})

過濾器函數始終以表達式的值作為第一個參數（item.content）。

帶引號的參數視為字符串，而不帶引號的參數按表達式計算。這里將表達式 item.id 將傳給過濾器作為第二個參數，表達式 item.name 的值在計算出來之后作為第三個參數。

注意一定要return 當前li需要顯示的內容，否則li無數據展示，這樣就可以實現監聽列表item的的渲染事件，厲害不！哈哈哈！

以上這篇Vue 監聽列表item渲染事件方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com