This question is quite specific to the implementation of a Nuxt 2 application using Vue Router and a custom "Navigation Stack" to manage multiple modals while maintaining the browsers back button functionality in iOS and Android. Without knowing the specific requirements of the application, it may be difficult to provide an accurate answer. However, based on the provided code snippets, it appears that the issue lies in the use of the window.history.pushState method when showing a new modal. In the current implementation, when a new modal is shown, the push mutation is called on the navStackStore which updates the URL using window.history.pushState. This works fine for a single modal, but when a second modal is shown on top of the first one, and the user uses the browser's back button, the Vue Router kicks in and navigates back to the index, bypassing the custom "Navigation Stack" array. To keep track of the user's movements and overlay the modals like a mobile app, a possible solution would be to use the window.history.replaceState method instead of pushState when showing a new modal on top of an existing one. This would replace the current URL in the browser's history with the new one, and the back button would still function as expected. Another solution could be to use a third-party library such as vue-router-stack which provides a similar "Navigation Stack" functionality for Vue Router. This library maintains a stack of routes, allowing you to push and pop routes programmatically, while still utilizing the browser's back button. Ultimately, the best approach would depend on the specific requirements and constraints of the application.