statemachine 持久化 jpa

转载

编程小匠人之魂 2025-04-09 04:41:39

文章标签 vue.js 数据刷新数据持久化 文章分类 机器学习人工智能

eventBus和$route.push.query同时使用，解决eventBus持久化问题，和跨组件引起的路由传参监听不到没变化的问题

将近两天高强度加班，我居然发现了这个，eventBus和$route.push.query同时使用，居然可以解决eventBus刷新数据就消失不持久的问题。

这个可以很好解决跨组件或者跨文件实现组件通信的问题

有人会说，你怎么不用vuex呢？vuex持久化也很麻烦，得封装持久化组件，最主要的就是，我这个项目只能用cookies，不能使用localStorage和sessionStorage，跨n个文件组件，那4kb的空间用完怎么办？还那么麻烦。

直接上代码

MenuTree.vue

// eventBus传递一次
this.$eventBus.$emit('typeId', item._id) 
this.$eventBus.$emit('lineBus', item.kf_online) 
this.$eventBus.$emit('versionBus', item.version) 
// 路由参数传递一次
this.$router.push({
 path:`/knowledge/${item.type}`,
 query:{
     typeId: item._id,
     online: item.kf_online,
     version: item.version,
     }
})

跨n个文件组件的content.vue

<span :title="title">{{kfVersion}}</span>

data() {
    return {
      types: this.$route.query.typeId,     // 将路由的数据保存到data
      kfVersion:  this.$route.query.version,
      kfLine: this.$route.query.online,
    };
  },


//  这个时候有人会说，这不就拿到数据了吗，bus完全冗余，没啥作用
//  开始我也这么认为的，后来我哭了，跨n个文件n个组件，$route.push.query拿动态数据的时候，它不变，就是watch监听也监听不到，undefind还是什么，我忘记了，这就是难受的地方，猜测估计是那个组件销毁了，所以拿不到。



 created(){    
    this.$eventBus.$on('typeId',(id)=>{        // 拿eventbus传过来的数据，放在data里
      this.types = id
    })
    this.$eventBus.$on('lineBus',(id)=>{
      this.kfLine = id
    })
    this.$eventBus.$on('versionBus',(id)=>{
      this.kfVersion = id
    })
  },


可以做个实验：
1、注调eventbus的接收，MenuTree.vue中改变version，kfVersion是并不会变化的，取消注释就好了。
2、把data里的 kfVersion:  this.$route.query.version,换成 kfVersion: "", 这个时候kfVersion的值就来自于eventbus了，刚加载，dom那里显示空。MenuTree.vue中改变version，然后正常跟着变化。但是一刷新数据就没了。


// 现在data里的数据就可以使用了，刷新不会消失
// 如果没有eventbus，MenuTree.vue里typeId、online、version变化，content.vue里拿到的这几个数据不会变化，可以说eventbus，解决了跨n文件n组件引起的$route.push.query不变的问题，$route.push.query解决了刷新页面，eventbus数据就没的问题。

可以做个实验：

1、注调eventbus的接收，MenuTree.vue中改变version，kfVersion是并不会变化的，取消注释就好了。
2、把data里的 kfVersion: this.$route.query.version,换成 kfVersion: “”, 这个时候kfVersion的值就来自于eventbus了，刚加载，dom那里显示空。MenuTree.vue中改变version，然后正常跟着变化。但是一刷新数据就没了。

结论

1、现在data里的数据就可以使用了，刷新不会消失
2、如果没有eventbus，MenuTree.vue里typeId、online、version变化，content.vue里拿到的这几个数据不会变化，可以说eventbus，解决了跨n文件n组件引起的 $statemachine 持久化 jpa_持久化$ route.push.query解决了刷新页面，eventbus数据就没的问题。