vue学习之----子路由返回传参

1、情境

由index页面跳转到detail页面：

从detail页面返回时，需要给index页面传一个参数tabIndex

2、实现

(1)detail页面：

beforeRouteLeave(to, from, next) {
　　if (to.name == 'Detail') {
　　　　to.query.tabIndex = "2";
　　}
　　next();
}

beforeRouteLeave(to, from, next)-----属于组件内的路由守卫

离开路由之前执行的函数,可用于页面的反向传值，页面跳转。

• to ：跳转到哪个页面
• from：从哪个页面跳转
• next：相当于一道门，通行

通俗理解：路由守卫就是路由跳转过程生命周期函数。

路由跳转的过程分为跳转前中后等过程，在每一个过程中都有一函数，就是路由守卫

(2)index页面：

mounted() {
　　if (this.$route.query.tabIndex) {
　　　　this.tabIndex = this.$route.query.tabIndex;
　　}
},