You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
v4.x
v5.x
v6.x
Nightly
Current Behavior
Dismissing a controller modal does not trigger onUnmounted Vue lifecycle hook on the inner component. In my case there is init/deinit logic that occurs in modal inner component lifecycle hooks which isn't running as expected.
In reproduction repo you will notice opening a message mounts the first message, but subsequent modal presentations use the first component with its initalized data as opposed to remounting and reinitializing.
Expected Behavior
As described in ion-modal docs, controller modals should not persist the inner component across presentations. The inner component should unmount when the modal is dismissed.
Steps to Reproduce
Present component in modal and dismiss modal.
Present modal again with the same component and different componentProps
Initial values from first modal presentation persist
Note the componentProps update as expected, however any initialization that occurs in setup script or lifecycle hooks fails to run.
Capacitor CLI : 4.6.2
@capacitor/android : not installed
@capacitor/core : 4.6.2
@capacitor/ios : not installed
Utility:
cordova-res : not installed globally
native-run : 1.7.1
System:
NodeJS : v16.15.0 (/Users/****/.nvm/versions/node/v16.15.0/bin/node)
npm : 9.1.2
OS : macOS
Additional Information
It's not clear to me whether this is expected behavior, however it contradicts my expectations based on the controller modal documentation. Is there a way to force the inner component to unmount on modal dismiss?
The text was updated successfully, but these errors were encountered:
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.
Prerequisites
Ionic Framework Version
Current Behavior
Dismissing a controller modal does not trigger onUnmounted Vue lifecycle hook on the inner component. In my case there is init/deinit logic that occurs in modal inner component lifecycle hooks which isn't running as expected.
In reproduction repo you will notice opening a message mounts the first message, but subsequent modal presentations use the first component with its initalized data as opposed to remounting and reinitializing.
Expected Behavior
As described in ion-modal docs, controller modals should not persist the inner component across presentations. The inner component should unmount when the modal is dismissed.
Steps to Reproduce
Note the componentProps update as expected, however any initialization that occurs in
setup script
or lifecycle hooks fails to run.Code Reproduction URL
https://github.com/a-Leong/vue-modal-behavior
Ionic Info
Ionic:
Ionic CLI : 6.20.6 (/Users/****/.nvm/versions/node/v16.15.0/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/vue 6.5.0
Capacitor:
Capacitor CLI : 4.6.2
@capacitor/android : not installed
@capacitor/core : 4.6.2
@capacitor/ios : not installed
Utility:
cordova-res : not installed globally
native-run : 1.7.1
System:
NodeJS : v16.15.0 (/Users/****/.nvm/versions/node/v16.15.0/bin/node)
npm : 9.1.2
OS : macOS
Additional Information
It's not clear to me whether this is expected behavior, however it contradicts my expectations based on the controller modal documentation. Is there a way to force the inner component to unmount on modal dismiss?
The text was updated successfully, but these errors were encountered: