mpvue解决同一页面组件反复进入数据被覆盖的问题

问题当同一个页面组件被反复进入时由于在mpvue中他们用的是一套vm，所以后面渲染的数据就会将前面页面的数据覆盖，这样在我们回退时就不会有以前页面的记录，一直会是最后一张页面的记录
原因

如图所示，在页面组件被created 此后，无论在小程序内该页面被关闭被隐藏被开启，该页面组件都不会被销毁，一直是在不停的修改同一个vue实例的data数据

思路每次当我们对同一页面组件进行跳转的时候将该页面的数据this.$data push进数据栈中，当在该页面组件执行回退事件unload是将最后放入的数据弹出，也就是前一个页面的数据，再将数据栈中的最后一个数据复制给this.data 对象。这样数据栈中数据的数量将会等于小程序页面栈中该页面组件的数量，也等于该页面组件执行回退事件的次数，当所有的回退事件执行完毕，数据栈也将被清空
效果
跳转压入

回退弹出当页面栈中该页面组件全部回退完时数据栈也被清空

解决
1 跳转由于小程序的页面栈上限是10 ，当页面数到10时执行wx.redirectTo方法，关闭上一个页面插入新的页面进入页面栈，如果此时我们需要重复的页面组件时A，中途跳转的其他组件是B
A---->B：将执行A的unload事件弹出A的数据，暂不压入数据
B---->A：由于A—>B没有压入数据当从B返回A时也不会再弹出数据
A---->A：弹出上个页面的数据，压入下个页面的数据

  herf(url) {
    let page = getCurrentPages()
    if (page.length < 10) {
      wx.navigateTo({
        url: url
      })
    } else {
      wx.redirectTo({
        url: url
      })
    }
  }

跳转A页面时压入数据

 pdList.push({ ...this.$data })

回退时弹出数据并对后面的页面赋值

  onUnload: function () {
    if (pdList.length > 0) {
      pdList.splice(pdList.length - 1, 1)
      console.log(pdList[pdList.length - 1])
      Object.assign(this.$data, pdList[pdList.length - 1])
    }

类似解决方案
https://github.com/heyushuo/mpvue-shop