这篇文章主要介绍了关于vue 获取页面详情后 切换页面时 如何监听用户是否修改过信息,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下

 

可以用 beforeRouteLeave 和 updated 来判断

name: 'supplier',

    components:{cmtWrap,cmtContent},

    props: [],

    beforeRouteLeave (to, from, next) {//离开当前页

      if(this.updateCount > 1){ //更新次数大于1 说明用户修改过当前页数据 因为获取详情时会更新一次

        if(from.path.includes('nowPath')){

          this.$confirm('即将离开当前页,请确定是否保存当前数据?', '离开当前页', {

            confirmButtonText: '保存',

            cancelButtonText: '不保存',

            type: 'warning'

          }).then(() => {

            //...todo 这里调接口 保存数据

            next()

          }).catch(() => {next()});

        }else{next()}

      }else{

        next()

      }

    },

    updated:function () {

      this.updateCount = this.updateCount + 1

    },

    data() {

      return {

        updateCount:0,//判断用户是否更新当前数据

      }

    },

    computed:{},

    watch:{},

    mounted:function () {    this.getInitData()  },

    methods: {

    getInitData:function(){

    //...todo  页面进来,先获取默认数据

 

    }

 

  },

  }
Logo

前往低代码交流专区

更多推荐