这篇“vue怎么实现本项目页面之间跳转”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“vue怎么实现本项目页面之间跳转”文章吧。
本项目页面之间跳转方式
在template模板中添加
button按钮加入click事件
<el-button type="primary" @click="func()">添加试题</el-button>
在methods中写入路径
func() {
this.$router.push({ path: "add-question" });
},
修改路由文件
加入所有跳转的本地界面

vue解决页面跳转问题
问题描述:两个不同的页面,进行带参数跳转
解决办法
1、需要跳转的页面,创建跳转方法。
//@click="PageJump(scope.row)"
//具体如下:
<el-table-column label="跳转页面" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="PageJump(scope.row)"
>点击跳转</el-button>
</template>
</el-table-column>
PageJump(row) {
this.$router.push({
path: "/页面/具体/路径/" + row.id,
params: {
id: row.id
}
});
}
2、配置路由(一般是router.js文件)
{
path: '/文件目录路径',
component: Layout,
hidden: true,
children: [
{
path: 'PageJump/data/:OtherId(\\d+)',
component: (resolve) => require(['@/views/跳转到的页面路径/index'], resolve),
name: 'PageJump',
meta: { title: '跳转到的页面', icon: '' }
}
]
}
按照这样基本可以完成带参数的页面跳转。
以上就是关于“vue怎么实现本项目页面之间跳转”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注天达云行业资讯频道。