一、编程式导航啥意思?

  所谓编程式导航是和​​<router-link>​​​相对应的。​​<router-link>​​​可以类比为传统的超链接​​<a>​​​,点击即可跳转,是静态的。但有时候我们需要动态跳转,比如:某用户想访问某个页面,但是该页面必须登陆以后才能访问,若该用户在未登录的请款修改访问该页面,则会自动跳转到登录页面。这种场景下,用我们传统的静态路由​​<router-link>​​是不太好实现的,优化方案就是使用我们的编程式导航

二、编程式导航怎么用

1.安装​​vue-router​​插件

  编程式导航是靠我们的​​vue-router​​​插件来实现的,所以需要安装​​vue-router​​插件(怎么安装,参见前面博文)。

2.路由

  分为两种方式,注意带参数时,两种写法的区别:
(1)第一种:

/**
* 第一种:这种对应配置路由为 { path: '/content', component: Content }
* 注意:
* 1.query 为请求 url 中所带参数
* 2.如果提供了 path,params 会被忽略
*/
this.$router.push({path: '/content', query: {id: '123'}});

(2)第二种:

// 第二种:这种对应配置路由为 { path: '/content', component: Content, name: 'content' },也叫命名路由
this.$router.push({name: 'content', params: {id: '123'}});