[Vuejs]-How to open route as modal on Desktop but page on mobile in Nuxt

3👍

Short answer would be you can’t, as for using a modal you need to tell the app what "actual route" you are on – imagine navigating directly to /login on desktop and the issue becomes clear.

My suggestion would be to not add a route for login, but to use a query Param for whether or not the Login modal should be displayed:

  • query Param would be handled by a LoginModal component on the app root
  • closing/opening would both trigger and be managed by changes to the query parameter

On mobile, the modal can be styled as a full screen block.

Leave a comment