导航守卫 beforeRouteLeave

一、卫士介绍
vue组件内部有三种导航卫士：
1、beforeRouteEnter
2、beforeRouteUpdate (2.2 新增)
3、beforeRouteLeave
顾名思义，beforeRouteLeave就是离开该页面时出发的卫士

 beforeRouteLeave (to, from, next) {
    // 导航离开该组件的对应路由时调用
    // 可以访问组件实例 `this`
  }

二、问题
在项目中，微信H5页面，支付页面不是在本公众号中直接唤起微信支付，而是跳转另外一个公众号进行支付，当支付成功获取 err_msg 为 ‘ok’ 时，回到支付页面将直接跳转成功回调页。但是该页面还设置了，左上角返回this.$router.back，且要求点击返回按钮时，要弹框提示是否确定离开支付页。
此时就有了冲突，因为支付成功后，回到支付页，立马就要跳转至成功回调页，此时就会触发beforeRouteLeave。

三、解决办法
成果回调页的path为'/medical-succeed'
beforeRouteLeave 的三个参数分别是
1、to：要去的页面
2、from： 本页面地址
3：next 下一步

** 这个离开守卫通常用来禁止用户在还未保存修改前突然离开。该导航可以通过 next(false) 来取消。

 beforeRouteLeave (to, from, next) {
      if (to.path === '/medical-succeed') {
        next()
      } else {
        this.weuijsDialog = this.$weuijs.confirm('确定不支付吗？', {
          isAndroid: false,
          buttons: [
            {
              label: '暂不支付',
              type: 'default',
              onClick: async () => {
                //location.hash='/medical/confirm-order'
                this.$router.replace({
                  path: '/medical/medical-order',
                  query: this.$route.query
                })
                location.reload()
              }
            },
            {label: '继续支付'}
          ]
        })
      }