ionic vue 开发app 页面跳转后列表刷新

最新推荐文章于 2024-08-09 11:23:30 发布

原创

最新推荐文章于 2024-08-09 11:23:30 发布 · 640 阅读

标签

#javascript #ionic #vue3

收录于

在开发Ionic Vue3应用程序时，遇到一个常见问题：从页面A进入页面B，B页面的操作未能实时更新返回的A页面数据。尽管尝试使用Vue的生命周期钩子如onMounted，但无法确保数据在返回时刷新。文章探讨了onIonViewWillEnter、onIonViewDidEnter等生命周期钩子的使用，并分析如何正确处理页面间数据同步，以确保页面数据的实时性。

ionic vue3 app 开发

场景直现

从页面A进入页面B，页面B进行操作后会影响页面A数据，此时返回A页面，页面数据没有重新加载

参考生命周期官方文档

使用vue的 onMounted 并不能保证每次返回上一页的时候列表数据刷新。

import {
   
   
  IonPage,
  onIonViewWillEnter,
  onIonViewDidEnter,
  onIonViewWillLeave,
  onIonViewDidLeave
} from '@ionic/vue';
import {
   
    defineComponent }