vue+Element表格超鏈接跳轉(zhuǎn)方式
更新時間:2024年09月17日 10:09:19 作者:小只笨笨狗~
在Vue項目中使用Element UI的表格組件時,可以通過具體的單元格渲染方法添加超鏈接,在表格的某列中,利用模板或渲染函數(shù)插入<a>標(biāo)簽,設(shè)置其href屬性指向目標(biāo)URL,實現(xiàn)點擊跳轉(zhuǎn)功能,此方法適用于需要從表格信息中快速導(dǎo)航到相關(guān)詳細(xì)頁面的場景
vue+Element表格超鏈接跳轉(zhuǎn)
1、背景 在vue中引入了Elem中的表格(Table),需要給某個單元格加超鏈接。
2、代碼
elementui-表格里面加超鏈接
前端在表格內(nèi)編號處加上超鏈接,顯示詳情:
<el-table-column prop="id" label="名稱" align="center" width="100"> <template slot-scope="props"> <el-link type="primary" @click="handle(props.row)" :underline="false">{{props.row.id}}</el-link> </template> </el-table-column>
總結(jié)
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue項目打包后提交到git上為什么沒有dist這個文件的解決方法
這篇文章主要介紹了vue項目打包后提交到git上為什么沒有dist這個文件的解決方法,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-09-09關(guān)于Element-UI可編輯表格的實現(xiàn)過程
這篇文章主要介紹了關(guān)于Element-UI可編輯表格的實現(xiàn)過程,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-07-07關(guān)于electron-vue打包后運行白屏的解決方案
這篇文章主要介紹了關(guān)于electron-vue打包后運行白屏的解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-10-10vue 組件之間事件觸發(fā)($emit)與event Bus($on)的用法說明
這篇文章主要介紹了vue 組件之間事件觸發(fā)($emit)與event Bus($on)的用法說明,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07Vue3 computed初始化獲取設(shè)置值實現(xiàn)示例
這篇文章主要為大家介紹了Vue3 computed初始化以及獲取值設(shè)置值實現(xiàn)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-10-10vue實現(xiàn)動態(tài)監(jiān)測元素高度
這篇文章主要介紹了vue實現(xiàn)動態(tài)監(jiān)測元素高度方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10