Vue3的el-table-column增加跳轉其他頁面的方法
更新時間：2025年02月06日 09:50:02 作者：KrityCat
文章介紹了如何在Vue3的el-table-column中增加跳轉其他頁面的功能,并提供了示例代碼和handleUpdate方法的源碼分析,感興趣的朋友跟隨小編一起看看吧
效果圖
既不影響顯示內(nèi)容，也不影響頁面跳轉
el-table-column寫法
<el-table-column
label="系統(tǒng)單號"
align="center"
prop="systematicReceipt"
width="180"
>
<template #default="scope">
<el-link type="primary">
<a target="_blank" @click="handleUpdate(scope.row)">{{
scope.row.systematicReceipt
}}</a>
</el-link>
</template>
</el-table-column>handleUpdate方法
function handleUpdate(row) {
const systematicReceipt = row.systematicReceipt;
router.push({
path: "/purchase/purchaseDocumentProcessing",
query: { systematicReceipt },
});
}源碼分析
可參考鎧思進銷存系統(tǒng)的ks-vue3/src/views/system/purchase/purchaseDocumentQuery.vue
到此這篇關于Vue3的el-table-column增加跳轉其他頁面的文章就介紹到這了,更多相關Vue3 el-table-column跳轉其他頁面內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
這篇文章主要介紹了Vue getter setter，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
Vue3?使用v-md-editor如何動態(tài)上傳圖片的方法實現(xiàn)
本文主要介紹了Vue3?使用v-md-editor如何動態(tài)上傳圖片，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-08-08
vue使用v-model實現(xiàn)父子組件傳值之子父組件同步更新方式
文章主要介紹了Vue2和Vue3中父子組件間通過props和emit實現(xiàn)雙向綁定的方法,Vue2中,子組件通過props接收值,通過$emit觸發(fā)change事件修改父組件數(shù)據(jù)；Vue3中方法類似,但語法略有不同2026-05-05
這篇文章主要介紹了vue緩存之keep-alive的理解和應用詳解，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-11-11
vue搜索頁開發(fā)實例代碼詳解（熱門搜索，歷史搜索，淘寶接口演示）
這篇文章主要介紹了vue搜索頁開發(fā)實例（熱門搜索，歷史搜索，淘寶接口演示）,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-04-04
這篇文章主要給大家分享的是 Vue中props用法介紹，? 在Vue中通過props,可以將原本孤立的組件串聯(lián)起來，也就是可以子組件可以接收父組件傳遞過來的data，下面我們一起進入文章看看內(nèi)容的詳細介紹吧,需要的朋友也可以參考一下2021-11-11
這篇文章主要為大家詳細介紹了Vue實現(xiàn)簡單的購物車案例，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
我們在做了用戶登錄后,就會讓用戶跳轉到個人中心,下面這篇文章主要給大家介紹了關于如何使用Vue+Element做個個人中心的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-06-06
這篇文章主要介紹了vue 自定義內(nèi)置組件 select的相關知識，整合了第三方jquery 插件select2,具體實例代碼大家參考下本文2018-04-04
這篇文章主要介紹了ElementUI下拉框選擇后不顯示值問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-02-02