失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > vue点击按钮实现跳转到另一个vue页面

vue点击按钮实现跳转到另一个vue页面

时间:2019-08-21 01:27:30

相关推荐

vue点击按钮实现跳转到另一个vue页面

首先需要对按钮绑定一个函数,然后在函数里进行页面路由的改变。

这里要确保项目中已经在使用vue-router。

如图,我想要跳转到这个index.vue页面

那么按钮绑定的函数里的路径应该这么写:

然后需要在router文件夹下的index.js里进行该页面的注册:

最主要的是我红框里的内容

代码如下

{path: '/directory',component: Layout,name: 'Directory',meta: {title: 'Directory',icon: 'el-icon-s-cooperation'},redirect: '/directory/index',children: [{path: '',name: 'Directory',component: () => import('@/views/directory/index'),meta: {title: 'navRoute.directory', icon: 'el-icon-s-cooperation', roles: ['user'] }},{path: 'newfilter/index',name: 'Newfilter',hidden: true,component: () => import('@/views/directory/newfilter/index'),meta: {title: 'navRoute.newfilter', roles: ['user'] }},{path: '*', redirect: 'directory/index', hidden: true }]},

然后就可以跳转成功啦!

如果觉得《vue点击按钮实现跳转到另一个vue页面》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。