vue移动端项目经验(三)

登录成功后跳转回上一页

评论页：
sendComment(){
    axios.get(`${common.commentapi}/comment?aid=${this.aid}`).then(res=>{
        if(res.data.code==200){
            this.$toast({
                message:'收藏成功',
                duration:2000,  
            })
        }else if(res.data.code==401){
            Dialog.confirm({
                message: '登录后才能收藏哦',
                confirmButtonText: "去登录",
                cancelButtonText: "下次吧"
            }).then(()=>{
                this.$router.replace({    //将当前页面路由替换成登录页路由，并将当前页面路由保存在query中为后面跳转回来做准备
                    path:"/user/login",
                    query: {redirect: this.$router.currentRoute.fullPath}
                }).catch(()=>{})
            })
        }
    })
}

登录页：
login(){
    axios.post(`${common.userapi}/login`,params).then(res=>{
        if(res.data.code==200){
            this.$toast({
                message:'登录成功',
                duration:2000,  
            })
            if(this.$route.query.redirect){  //判断若是路由中保存了上一页的路由信息，则执行以下代码跳转回上一页。这里注意route与router的区别使用
                this.$router.replace({path:decodeURIComponent(this.$route.query.redirect)})  //这里为什么用replace不用push？因为直接替换路由不会产生新的history记录。以防止产生新的history记录导致相关页面的router.go(-1)出现问题
            }else{
                this.$router.push('/')  //否则则跳往首页
            }
        }
    })
}