// 注意: 一定要区分 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的形式进行路由导航的更多相关文章

  1. vue.js编程式路由导航 --- 由浅入深

    编程式路由导航 实例中定义一个方法,这个方法绑定在标签上 然后就设置路由跳转 语法 this.$router.history.push('要跳转路由的地址') <!DOCTYPE html> ...

  2. Vue的钩子函数[路由导航守卫、keep-alive、生命周期钩子]

    前言 说到Vue的钩子函数,可能很多人只停留在一些很简单常用的钩子(created,mounted),而且对于里面的区别,什么时候该用什么钩子,并没有仔细的去研究过,且Vue的生命周期在面试中也算是比 ...

  3. 【VUE】5.路由导航守卫

    1. 功能需求 1. 当用户登陆成功后,把得到的token存到Session Storage 2. components -> Form.vue , 对预验证进行校验,如果验证不正确就跳出,如果 ...

  4. vue之路由导航守卫-全局前置守卫

    一.使用方式 全局前置守卫用于在路由配置生效之前进行一些动作,可以使用 router.beforeEach 注册一个全局前置守卫: const router = new VueRouter({ ... ...

  5. Vue Router路由导航及传参方式

    路由导航及传参方式 一.两种导航方式 ①:声明式导航 <router-link :to="..."> ②:编程式导航 router.push(...) 二.编程式导航参 ...

  6. 【vue】iView-admin2.0动态菜单路由

    vue项目实现动态路由有俩种方式 一.前端在routers中写好--所有--路由表 <前端控制路由>,登录时根据用户的角色权限来动态的显示菜单路由 二.前端通过调用接口请求拿到当前用户-- ...

  7. vue组件、自定义指令、路由

    1.vue组件 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的 ...

  8. 【vue】iView-admin2.0动态菜单路由【版2】

    依照iView-admin2.0动态菜单路由[版1] 归纳几个节点动态路由获取方式2 ——> easymock假数据 ——> 数据转组件处理.addRoutes ——> localS ...

  9. Vue2学习小记-给Vue2路由导航钩子和axios拦截器做个封装

    1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2. ...

随机推荐

  1. 【转载】 Sqlserver查看数据库死锁的SQL语句

    在Sqlsever数据库中,有时候操作数据库过程中会进行锁表操作,在锁表操作的过程中,有时候会出现死锁的情况出现,这时候可以使用SQL语句来查询数据库死锁情况,主要通过系统数据库Master数据库来查 ...

  2. CheckForIllegalCrossThreadCalls = false 是干嘛的?

    public Form1() {     InitializeComponent();     CheckForIllegalCrossThreadCalls = false; }       在多线 ...

  3. RNN-LSTM入门

    RNN-LSTM入门 Last Edited: Dec 02, 2018 10:20 PM Tags: 机器学习,论文阅读 RNN-Recurrent Neural Network 概念: 序列数据: ...

  4. spring boot 打jar包,获取resource路径下的文件

    前言:最近在spring boot项目静态类中获取resource路径下文件,在idea中启动都可以获取,但是打包后变成了jar包 就无法获取到. 我想到了两种方法,一种是根据http访问静态资源比如 ...

  5. sqoop将mysql数据导入hbase、hive的常见异常处理

    原创不易,如需转载,请注明出处https://www.cnblogs.com/baixianlong/p/10700700.html,否则将追究法律责任!!! 一.需求: 1.将以下这张表(test_ ...

  6. MapperFacade自动导入失败

    MapperFacade自动导入失败 添加以下代码并且保证项目可以扫描到: @Configuration public class OrikaConfig { @Bean public MapperF ...

  7. Python3 系列之 基础语法篇

    基础数据类型 整数 python 可以处理任意大小的整数 浮点数 python 可以处理任意大小的浮点数,但是需要注意的一点是:整数运算永远是精确的(除法也是精确的),而浮点数运算则可能会有四舍五入的 ...

  8. 魔幻般冒泡背景的CSS3按钮动画

    这是一款非常有特点的CSS3按钮,按钮的背景不是北京图片,也不是单纯的颜色,而是一组魔幻般的冒泡背景动画.当我们将鼠标滑过按钮时,按钮的冒泡背景动画就可以展示出来.可以说这款CSS3按钮的设计风格相当 ...

  9. 中国 AI 天才养成计划:清华姚班和 100 个「张小龙」

    https://daily.zhihu.com/story/9653612?from=timeline&isappinstalled=0   AI财经社,专注未来,以及更好的生活 真正的 AI ...

  10. UoW中修改VIM的配色方案

    在WIN10中提供Bash on Ubuntu on Windows,即在win中提供一个Ubuntu子系统,可以使用bash.该系统中自带的VIM的配色方案colorscheme为默认的,不怎么好, ...