vue 页面切换监听事件

这篇文章主要介绍了关于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  页面进来，先获取默认数据

 

　　　　}

 

　　},

  }