通过js控制路由跳转中go,push,replace的区别

·  阅读 109

go()方法

语法:this.$router.go(n)

作用:向前或者向后跳转n个页面,n可为正整数或负整数

push()方法

语法:this.$router.push(url)

作用:跳转到指定url路径,并想history栈中添加一个记录,点击后退会返回到上一个页面

//传递的参数为字符串时,参数为路由规则数组中的path值
this.$router.push('url')

//传递的参数为对象时,对象会包含一个path属性用于设置跳转的url
this.$router.push({
    path:'url'
})

//还可使用再路由规则数组中定义的name属性进行跳转
this.$router.push({
    name:'路由规则数组中定义的name属性进行跳转'
})

//传递参数
//path跳转传参
//接收:this.$route.query.参数名
this.$router.push({
    path:'url',
    //使用path属性进行跳转时会将参数拼接在url?参数名1=参数值1&参数名2=参数值2
    query:{
        参数名1:参数值1,
        参数名2:参数值2,
    }
})

//name跳转传参
//接收:this.$route.params.参数名
this.$router.push({
    name:'name属性的值',
    //使用name属性进行跳转时会将参数直接拼接在路径后面
    params:{
        参数名1:参数值1,
        参数名2:参数值2,
    }
})
复制代码

注意:path不可以和params一起使用;记忆:两个p不可以同时使用

replace()方法

语法:this.$router.replace('url') 作用:跳转到指定url路径,但是history栈中不会有记录,点击返回会跳转到上上个页面

传参,传值方法与push方法相同

分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改