Vue3的el-table-column增加跳轉(zhuǎn)其他頁面的方法
更新時間：2025年02月06日 09:50:02 作者：KrityCat
文章介紹了如何在Vue3的el-table-column中增加跳轉(zhuǎn)其他頁面的功能,并提供了示例代碼和handleUpdate方法的源碼分析,感興趣的朋友跟隨小編一起看看吧
效果圖
既不影響顯示內(nèi)容，也不影響頁面跳轉(zhuǎn)
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 },
});
}源碼分析
可參考鎧思進(jìn)銷存系統(tǒng)的ks-vue3/src/views/system/purchase/purchaseDocumentQuery.vue
到此這篇關(guān)于Vue3的el-table-column增加跳轉(zhuǎn)其他頁面的文章就介紹到這了,更多相關(guān)Vue3 el-table-column跳轉(zhuǎn)其他頁面內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue3源碼分析reactivity實(shí)現(xiàn)原理
這篇文章主要為大家介紹了vue3源碼分析reactivity實(shí)現(xiàn)原理詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-01-01
這篇文章主要介紹了vue 左滑刪除功能的示例代碼，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-01-01
vue通信方式EventBus的實(shí)現(xiàn)代碼詳解
這篇文章主要介紹了vue通信方法EventBus的實(shí)現(xiàn)代碼，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值，需要的朋友可以參考下2019-06-06
這篇文章主要給大家介紹了關(guān)于Vue+element-ui添加自定義右鍵菜單的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12
Vue+Vuex實(shí)現(xiàn)自動登錄的知識點(diǎn)詳解
在本篇文章里小編給大家整理的是關(guān)于Vue+Vuex實(shí)現(xiàn)自動登錄的知識點(diǎn)詳解，需要的朋友們可以學(xué)習(xí)下。2020-03-03
vue.js自定義組件實(shí)現(xiàn)v-model雙向數(shù)據(jù)綁定的示例代碼
這篇文章主要介紹了vue.js自定義組件實(shí)現(xiàn)v-model雙向數(shù)據(jù)綁定的示例代碼，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01
Vue3中的createGlobalState用法及示例詳解
createGlobalState 是 Vue 3 中一種管理全局狀態(tài)的簡便方式,通常用于管理多個組件間共享的狀態(tài),由 @vueuse/core 提供的,允許創(chuàng)建一個響應(yīng)式的全局狀態(tài),本文給大家介紹了Vue3中的createGlobalState用法及示例,需要的朋友可以參考下2024-10-10
利用Vue3實(shí)現(xiàn)鼠標(biāo)跟隨效果
在Web開發(fā)領(lǐng)域,鼠標(biāo)跟隨效果是一種能顯著提升頁面交互性、增加動態(tài)感與趣味性的常見方式,下面我們看看如何使用Vue3實(shí)現(xiàn)鼠標(biāo)跟隨效果吧2024-11-11
這篇文章主要介紹了Vue編寫自定義Plugin詳解,在Vue開發(fā)中，我們經(jīng)常需要使用一些第三方庫或功能性模塊，Vue插件就是一種將這些庫或模塊集成到Vue應(yīng)用中的方式,插件是Vue.js提供的一種機(jī)制，用于擴(kuò)展Vue的功能,需要的朋友可以參考下2023-08-08
vue修改vue項(xiàng)目運(yùn)行端口號的方法
本篇文章主要介紹了vue修改vue項(xiàng)目運(yùn)行端口號的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08