vue使用JS的形式进行路由导航
// 注意: 一定要区分 this.$route 和 this.$router 这两个对象,
// 其中: this.$route 是路由【参数对象】,所有路由中的参数, params, query 都属于它
// 其中: this.$router 是一个路由【导航对象】,用它 可以方便的 使用 JS 代码,实现路由的 前进、后退、 跳转到新的 URL 地址 console.log(this);
// 1. 最简单的
// this.$router.push("/home/goodsinfo/" + id);
// 2. 传递对象
// this.$router.push({ path: "/home/goodsinfo/" + id });
// 3. 传递命名的路由
this.$router.push({ name: "goodsinfo", params: { id } });
{ path: '/home/goodsinfo/:id', component: GoodsInfo, name: 'goodsinfo' },
vue使用JS的形式进行路由导航的更多相关文章
- vue.js编程式路由导航 --- 由浅入深
编程式路由导航 实例中定义一个方法,这个方法绑定在标签上 然后就设置路由跳转 语法 this.$router.history.push('要跳转路由的地址') <!DOCTYPE html> ...
- Vue的钩子函数[路由导航守卫、keep-alive、生命周期钩子]
前言 说到Vue的钩子函数,可能很多人只停留在一些很简单常用的钩子(created,mounted),而且对于里面的区别,什么时候该用什么钩子,并没有仔细的去研究过,且Vue的生命周期在面试中也算是比 ...
- 【VUE】5.路由导航守卫
1. 功能需求 1. 当用户登陆成功后,把得到的token存到Session Storage 2. components -> Form.vue , 对预验证进行校验,如果验证不正确就跳出,如果 ...
- vue之路由导航守卫-全局前置守卫
一.使用方式 全局前置守卫用于在路由配置生效之前进行一些动作,可以使用 router.beforeEach 注册一个全局前置守卫: const router = new VueRouter({ ... ...
- Vue Router路由导航及传参方式
路由导航及传参方式 一.两种导航方式 ①:声明式导航 <router-link :to="..."> ②:编程式导航 router.push(...) 二.编程式导航参 ...
- 【vue】iView-admin2.0动态菜单路由
vue项目实现动态路由有俩种方式 一.前端在routers中写好--所有--路由表 <前端控制路由>,登录时根据用户的角色权限来动态的显示菜单路由 二.前端通过调用接口请求拿到当前用户-- ...
- vue组件、自定义指令、路由
1.vue组件 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的 ...
- 【vue】iView-admin2.0动态菜单路由【版2】
依照iView-admin2.0动态菜单路由[版1] 归纳几个节点动态路由获取方式2 ——> easymock假数据 ——> 数据转组件处理.addRoutes ——> localS ...
- Vue2学习小记-给Vue2路由导航钩子和axios拦截器做个封装
1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2. ...
随机推荐
- eclipse如何将项目上传到码云
把Eclipse项目上传到码云的步骤: 一.将代码提交到本地 1.登录码云:新建项目 2.输入项目名: 3.空项目创建成功如下图: 4.右键点击Eclipse的项目,选择“Team”——>“Sh ...
- ife2018 零基础学院 day 4
第四天,背景边框列表链接和更复杂的选择器 背景,边框,列表,链接相关属性 背景 MDN 背景 W3School 背景 元素的背景是指,在元素内容.内边距和边界下层的区域. 属性 描述 backgrou ...
- 《深入理解Java虚拟机》(三)垃圾收集器与内存分配策略
垃圾收集器与内存分配策略 详解 3.1 概述 本文参考的是周志明的 <深入理解Java虚拟机>第三章 ,为了整理思路,简单记录一下,方便后期查阅. 3.2 对象已死吗 在垃圾收集器进行回收 ...
- npm 安装 卸载 模块(转载)
来源 https://blog.csdn.net/yihanzhi/article/details/75665959 利用npm 安装删除模块 npm安装模块 [npm install xxx]利用 ...
- QueryRunner使用之可变条件的处理
在三层架构的Dao层中,需要通过不确定的条件,从数据库查询结果. 可以利用List集合作为容器将条件存储起来. 实际开发中的代码: public List<Hotel> searchByF ...
- 数据结构——基于java的链表实现(真正理解链表这种数据结构)
原创不易,如需转载,请注明出处https://www.cnblogs.com/baixianlong/p/10759599.html,否则将追究法律责任!!! 一.链表介绍 1.什么是链表? 链表是一 ...
- linux中make的用法
一.linux中make的用法 目的: 基本掌握了make 的用法,能在Linux系统上编程.环境: Linux系统准备: 准备三个文件:file1.c, file ...
- vim 学习笔记系列(前言)
今天上午的时候,看到大神在用vim编程,画面直观,速度很快,操作只需要用命令符就可以实施. 所以可以推断vim的命令符是复杂的,那么学习过程中记忆会很漫长,很痛苦,但是如果记住了这些命令符,并可以熟练 ...
- Http(s)与后台交互方式
前言 Http(s)是前后端交互的主要方式之一,交互技术主要有:Ajax(XMLHttpRequest).Fetch.地址跳转(window.open.location.href).Http(s)与后 ...
- 【Web前端】用CSS3实现弹幕
初版 用css3来实现弹幕确实比较简单,只需要设置动画让弹幕从屏幕右侧移动到屏幕左侧即可,一开始是这样实现的 .danmu { position: fixed; left: %; animation: ...