bug: vue, lifecycle hooks not fired with vue 3.2 setup

[riderx]

Prequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x

Current Behavior

This code in component is never trigger :

  onIonViewDidEnter(() => {
      console.log('About page did enter');
    });

  onIonViewDidLeave(() => {
    console.log('About page did leave');
  });

  onIonViewWillEnter(() => {
    console.log('About page will enter');
  });

  onIonViewWillLeave(() => {
    console.log('About page will leave');
  });

Expected Behavior

this should be triggered during routing

Steps to Reproduce

you can clone : https://github.com/riderx/ionicv6-beta-vue-vite
yarn
and
yarn dev

Code Reproduction URL

https://github.com/riderx/ionicv6-beta-vue-vite

Ionic Info

Ionic:

Ionic CLI : 6.17.0

Utility:

cordova-res (update available: 0.15.3) : 0.15.2
native-run : 1.4.0

System:

NodeJS : v16.7.0
npm : 7.20.3
OS : macOS Monterey

Additional Information

No response

[liamdebeasi]

Thanks for the issue. This looks like an incompatibility with the new <script setup> feature in Vue 3.2.

[riderx]

@liamdebeasi I tried in setup function in normal component and same issue, but I didn't try in component custom propriety

[snowwolfjay]

any progress? because the router cache, it looks like disaster, because when you just need open one page, it open five visited for you... go(-1)/replace / back not clear the cache.

[raymer]

Any update on this? My app is having really wonky behavior similar to the comment above me. Vue recommends <script setup> as the way to do single file components. https://v3.vuejs.org/api/sfc-script-setup.html

[snowwolfjay]

Hi, I will make a small change try fix this.
Hooks function not work due to: lifecycle property is defined at a instance which make it be a private property so cant access and fire, please check whether there is some better way #24253

[liamdebeasi]

Thanks for the issue. This has been resolved via #24253, and a fix will be available in an upcoming release of Ionic Framework.

Big thanks to @snowwolfjay for creating the fix!

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.