關(guān)于row-click和current-change的用法及說明
一、row-click和current-change官方文檔的使用介紹
1.row-click
當(dāng)表格某一行被點(diǎn)擊時(shí)會觸發(fā)該事件，
參數(shù)：
rowcolumnevent
2.current-change
當(dāng)表格的當(dāng)前行發(fā)生變化的時(shí)候會觸發(fā)該事件，
參數(shù)：
currentRowoldCurrentRow
二、問題和解決
1.需求
有四個(gè)表，A表、B表、C表、D表，B表與A表聯(lián)動(dòng)，C表與B表聯(lián)動(dòng)，D表與C表聯(lián)動(dòng)，
即：
當(dāng)點(diǎn)擊A表某一行時(shí)，B表展示該點(diǎn)擊行相關(guān)的數(shù)據(jù)，C、D表同理
2.問題
使用row-click事件
點(diǎn)擊A表第一行時(shí)，B表展示A表第一行相關(guān)數(shù)據(jù)，C表卻展示不出來與B表第一行相關(guān)數(shù)據(jù)（初始默認(rèn)焦點(diǎn)在第一行）；
然后點(diǎn)擊B表第一行，C表才能展示B表第一行相關(guān)數(shù)據(jù)；
接著點(diǎn)擊A表第二行，這時(shí)候假設(shè)B表沒有A表第二行相關(guān)數(shù)據(jù)，也就是B表此時(shí)數(shù)據(jù)為空，那么會發(fā)現(xiàn)C表依舊展示了B表第一行的相關(guān)數(shù)據(jù)，此時(shí)C表應(yīng)該是無數(shù)據(jù)才對
3.解決
使用current-change事件
點(diǎn)擊A表第一行時(shí)，B表展示A表第一行相關(guān)數(shù)據(jù)，同時(shí)C表也展示了B表第一行相關(guān)數(shù)據(jù)（初始默認(rèn)焦點(diǎn)在第一行）；
因?yàn)镃表已經(jīng)展示數(shù)據(jù)了，所以就直接點(diǎn)擊A表第二行，此時(shí)B表展示A表第二行相關(guān)數(shù)據(jù)，這時(shí)候同樣假設(shè)B表沒有A表第二行相關(guān)數(shù)據(jù)，會發(fā)現(xiàn)C表也正常的沒有數(shù)據(jù)展示了
總結(jié)
row-click，是只有當(dāng)點(diǎn)擊行的時(shí)候才會觸發(fā)，如果沒有點(diǎn)擊行，只是行數(shù)據(jù)或行焦點(diǎn)改變，是無法觸發(fā)該事件；
current-change，是當(dāng)前行變化時(shí)觸發(fā)，即使不點(diǎn)擊某行，只要行數(shù)據(jù)或行焦點(diǎn)改變了，就會觸發(fā)該事件，當(dāng)然也包括“點(diǎn)擊”不同行時(shí)，也會觸發(fā)該事件
所以，有時(shí)候current-change可以直接替代row-click去使用
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue中el-date-picker限制選擇7天內(nèi)&禁止內(nèi)框選擇
項(xiàng)目中需要選擇時(shí)間范圍,并且只能選擇當(dāng)前日期之后的七天,本文就來介紹了vue中el-date-picker限制選擇7天內(nèi)&禁止內(nèi)框選擇,具有一定的參考價(jià)值,感興趣的可以了解一下2023-12-12
VUE整合Echarts實(shí)現(xiàn)簡單的數(shù)據(jù)可視化方式
文章介紹了ECharts的數(shù)據(jù)可視化功能和使用過程,首先,文章闡述了ECharts的功能和優(yōu)勢,接著,文章通過安裝ECharts、創(chuàng)建容器、獲取DOM對象、引入圖表等代碼片段等步驟詳細(xì)介紹了柱狀圖和餅圖的可視化過程,最后,文章介紹了主題的下載和應(yīng)用,以提高可視化效果2026-04-04
vue前端性能優(yōu)化之預(yù)加載和懶加載示例詳解
這篇文章主要為大家介紹了vue前端性能優(yōu)化之預(yù)加載和懶加載示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-02-02
vue實(shí)現(xiàn)水波漣漪效果的點(diǎn)擊反饋指令
鼠標(biāo)移入時(shí)的小手、鼠標(biāo)點(diǎn)擊時(shí)按鈕下壓彈起的動(dòng)畫、觸屏應(yīng)用點(diǎn)擊時(shí)的屏幕震動(dòng)，這些效果也被統(tǒng)稱為點(diǎn)擊反饋，雖然看似是應(yīng)用中的細(xì)枝末節(jié)，但是只要稍微投入一點(diǎn)點(diǎn)心思，帶來的用戶體驗(yàn)提升是十分明顯的,這里作者為小伙伴們推薦一種作者最喜歡的點(diǎn)擊反饋效果。2021-05-05
這篇文章主要介紹了Vue中導(dǎo)入excel文件的兩種方式,大概有兩種導(dǎo)入文件的方法：form表單和el-upload，本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-12-12
vue-cli 3如何使用vue-bootstrap-datetimepicker日期插件
這篇文章主要介紹了vue-cli 3如何使用vue-bootstrap-datetimepicker日期插件，幫助大家更好的理解和學(xué)習(xí)使用vue框架，感興趣的朋友可以了解下2021-02-02
如何使用HBuilderX把vue項(xiàng)目打包成apk
這篇文章主要介紹了如何使用HBuilderX把vue項(xiàng)目打包成apk，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-07-07
深入理解vue輸入框字符限制的優(yōu)化設(shè)計(jì)方案
限制輸入框字符是一項(xiàng)需要結(jié)合技術(shù)實(shí)現(xiàn)與用戶體驗(yàn)的綜合設(shè)計(jì),通過實(shí)時(shí)限制、提交校驗(yàn)與性能優(yōu)化,開發(fā)者可以高效解決輸入限制問題,同時(shí)提升用戶滿意度和數(shù)據(jù)安全性,本文給大家介紹vue輸入框字符限制的優(yōu)化設(shè)計(jì),感興趣的朋友跟隨小編一起看看吧2024-12-12
Vue.js結(jié)合Ueditor富文本編輯器的實(shí)例代碼
本篇文章主要介紹了Vue.js結(jié)合Ueditor的項(xiàng)目實(shí)例代碼，這里整理了詳細(xì)的代碼，具有一定的參考價(jià)值，有興趣的可以了解一下2017-07-07
這篇文章主要為大家詳細(xì)介紹了Vue2幾種常見開局方式，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09