vue.js实现跳转页面的方法：1、 使用标签【】进行跳转；2、使用【this.$router.push()】方法，只有一个参数的时候，代表跳转地址，还可以增加一个参数传值。
【相关文章推荐：vue.js】
vue.js实现跳转页面的方法：
点击底部书架跳转到对应的页面
<router-link :to="{name: 'bookshelf', params: { entityId: this.entityId } }"
:class="{'flex-item-1':'flex-item-1',cur:tabs[0].isShow}" href="javascript:">
<span class="tabNav-ico tabNav-book"></span>
<span class="tabNav-txt">书 架</span>
</router-link>'name': 'bookshelf'表示要跳转的Vue组件名称，名称是在router文件下的index.vue中进行设置。
立即学习“前端免费学习笔记（深入）”；
{
path: '/bookshelf',
name: 'bookshelf',
component: Bookshelf
},params :{entityId: this.entityId}里面是要传递过去的参数。
在bookshelf组件接收参数
this.bookshelfId = this.$route.params.entityId;
除了使用标签<router-link>进行跳转，还可以使用下面的方法
<a @click="toIndex" :class="{'flex-item-1':'flex-item-1',cur:tabs[2].isShow}" href="javascript:">
<span class="tabNav-ico tabNav-home"></span>
<span class="tabNav-txt">首 页</span>
</a>
toIndex: function(){
this.$router.push("/?entityId="+ localStorage.getItem("entityId"));
}同样可以跳转页面，this.$router.push()方法只有一个参数的时候，代表跳转地址，还可以增加一个参数传值。
写法：
this.$router.push({name: "deepReadingDetail", params: {'id': data.id, 'title': data.title}});接收参数：
this.$route.params.title
相关免费学习推荐：javascript（视频）
以上就是vue.js怎样做跳转页面的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告
收藏
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
336
