Vue 跳转与回退

Vue 跳转与回退

跳转（一）

// 跳转到指定url路径，并想history栈中添加一个记录，点击后退会返回到上一个页面
< router-link :to = '...' />
// 参数可以是字符串、路径、路径带参数
// 字符串
this.$router.push('/editCustomer')
// 对象
this.$router.push({path: 'editCustomer'})
// 带参数对象
this.$router.push({path: 'editCustomer', query: {'account': this.name}})
// 跳转后的页面获取参数
this.name = this.$route.query.name

跳转（二）

// 跳转到指定url路径，但是history栈中不会有记录，点击返回会跳转到上上个页面
<reouter-link :to="..." replace />
router.replace(...)
this.$router.replace('/editCustomer')
this.$router.replace({ name: this.pageFrom, params: this.formData })
// push方法也可以传replace
this.$router.push({path: '/homo', replace: true})

回退

// 向前或者向后跳转n个页面，n可为正整数或负整数
1.向前一个界面
this.$router.go(1) // 类似history.forward()
2.后退一个界面
this.$router.go(-1) // 类似history.back()