解決vue 局部過濾器獲取不到this的問題
vue 局部過濾器獲取不到this
data里面加個字段賦值this。
<el-table-column property="sendLab" label="項(xiàng)目流向" width="*"> <template slot-scope="scope"> <span> {{ scope.row.sendLab | formataLab(that) }} </span> </template> </el-table-column>
這里用的element table , 在過濾器里傳入?yún)?shù),that。
就可以獲取到data里的變量了。
vue filters為什么獲取不到this
問題
<div>{{auditResult | auditResultNameFilter}}</div>
data() { return { auditResultOptions: [...] } }, filters: { auditResultNameFilter(status) { let [obj] = this.auditResultOptions.filter(item => item.value === status); return obj.name; } },
上面會出現(xiàn)報錯
原因
關(guān)于這個問題尤大有講
【this undefined in filters #5998】https://github.com/vuejs/vue/issues/5998
解決方法
我們可以用下面這種寫法、或者用計算屬性跟方法都行,比如下面這種
<div>{{auditResult | auditResultNameFilter(auditResultOptions)}}</div>
filters: { auditResultNameFilter(status, auditResultOptions) { let [obj] = auditResultOptions.filter(item => item.value === status); return obj.name; } },
以上為個人經(jīng)驗(yàn),希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue項(xiàng)目搭建以及全家桶的使用詳細(xì)教程(小結(jié))
這篇文章主要介紹了vue項(xiàng)目搭建以及全家桶的使用詳細(xì)教程(小結(jié)),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-12-12vue.js實(shí)現(xiàn)點(diǎn)擊后動態(tài)添加class及刪除同級class的實(shí)現(xiàn)代碼
這篇文章主要介紹了vue.js實(shí)現(xiàn)點(diǎn)擊后動態(tài)添加class及刪除同級class的相關(guān)資料,需要的朋友可以參考下2018-04-04Vue路由組件通過props配置傳參的實(shí)現(xiàn)
本文主要介紹了Vue路由組件通過props配置傳參的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-06-06vue實(shí)現(xiàn)表單單獨(dú)移除一個字段驗(yàn)證
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)表單單獨(dú)移除一個字段驗(yàn)證,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-03-03element中el-cascader級聯(lián)選擇器只有最后一級可以多選
本文主要介紹了element中el-cascader級聯(lián)選擇器只有最后一級可以多選,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2024-01-01Vue循環(huán)遍歷選項(xiàng)賦值到對應(yīng)控件的實(shí)現(xiàn)方法
這篇文章主要介紹了Vue-循環(huán)遍歷選項(xiàng)賦值到對應(yīng)控件的實(shí)現(xiàn)方法啊,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-06-06Vue中進(jìn)行分布式鑒權(quán)與認(rèn)證的過程
在Vue應(yīng)用中,我們通常需要實(shí)現(xiàn)分布式鑒權(quán)和認(rèn)證,以確保用戶的安全性和數(shù)據(jù)的保密性,本文將介紹在Vue中如何進(jìn)行分布式鑒權(quán)與認(rèn)證,需要的朋友可以參考下2023-06-06