在vue项目中,往往会遇到这样的情况,就是要实现在table表格中,点击其中某一行或者某一列跳转到下个页面
点击某一行实现跳转
给table添加点击事件
<el-table
:data=" capitalData"
style="width: 100%"
:header-cell-style="table.styleObj"
:stripe="table.stripe"
@selection-change="handleSelectionChange"
@row-click="openDialog"
>
</el-table
在methods里面添加方法,此时的跳转页面需要是加载在router里面的,
openDialog() {
this.$router.replace({
path: `/orderDetail`,
query: {pageNum: this.pageNum}
});
},
点击某一列实现跳转
<el-table-column prop="orderId" label="关联订单" >
<template slot-scope="scope">
<router-link tag="a" :to="{path:'/orderDetail',query:{id:scope.row.orderId}}">{{ scope.row.orderId}}</router-link>
</template>
</el-table-column>