How to fire ionViewDidEnter in subcomponents of a page

Ionic Framework Ionic Vue
1 
<template>
  <ion-page>
    <ion-header>
      <ion-toolbar>
        <ion-title>Tab1</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content>
      <my-comp-a></my-comp-a>
    </ion-content>
  </ion-page>
</template>
...
export default {
  name: 'Tab1',
 components: {myCompA ... },
  setup(){
     onIonViewDidEnter(()=> {
       // fires ok
     })
  },
}


export default {
  name: 'myCompA ',
  setup(){
     onIonViewDidEnter(()=> {
       //  i want to update some data here ,but it doesn't get fired，
      //  someone idea,thanks
     })
  },
}
2

Ionic Lifecycle Hooks are only fired on components that contain <ion-page>. Your Tab1 component is a page that is navigated to via a URL and has an ion-page component, so it receives lifecycle hooks.

Your myCompA is just a regular Vue component and does not take part in routing so there is no Ionic lifecycle hook necessary. Instead, you should use a Vue lifecycle hook: Lifecycle Hooks | Vue.js

See the Ionic Lifecycle docs for more information: Vue Lifecycle - Ionic Documentation

1 Like
3

if it is a sub-component, then i would suggest that you pass the data as props to the child component and keep the data management in the parent component

1 Like
4

Thanks so much in advance. i will try