vue路由跳转

html中进行设置

//不带参数
<nuxt-link to="/companyProfile#goQyjj" target='_blank' tag="a"></nuxt-link>
<nuxt-link :to="{path:'/home'}" target='_blank'>
<nuxt-link :to="{name:'/home'}" target='_blank'>
//带参数
<nuxt-link :to="{ path: '/home/media',query:{category_id:1}}" target='_blank' tag="a">

js进行路由跳转

一、push:跳转到指定url路径,并想history栈中添加一个记录,点击后退会返回到上一个页面
//不带参数
this.$router.push({path:'/home/news'});
//带参数
this.$router.push({path:'/home/news',query:{news_id:news_id,visit_flag:1}});
this.$router.push({path:'/home/news',params:{news_id:news_id,visit_flag:1}});

//通过name跳转
    openNew(name, id) {
        this.$router.push({
        name: name,
        query: {
          id: id
        }
      })
    },

二、replace用法同push一样,跳转到指定url路径,但是history栈中不会有记录,点击返回会跳转到上上个页面 (就是直接替换了当前页面)

this.$router.replace() 

三、go向前或者向后跳转n个页面,n可为正整数或负整数 
this.$router.go(n) 

注意:query和params区别

query类似 get, 跳转之后页面 url后面会拼接参数,类似?id=1, 非重要性的可以这样传, 密码之类还是用params刷新页面id还在

params类似 post, 跳转之后页面 url后面不会拼接参数 , 但是刷新页面id 会消失

跳转到外部链接

indow.open(url,'_blank')