Hello everyone,
I'm new to the combination of Inertia + Vue inside a Laravel project.
In this project, I found a weird issue where some links when clicked will stack on top of each other. This happened on some links only, not all. Issue fixed temporarily by hard refresh (ctrl+shift+r) but it'll come again.
If you see on the screenshot below, the bright (white background) is the stack that is active, the grey area above it is the one that I click a link.
I have added a ssr stop and ssr start on Forge deployment.
I also already use Link from Inertia not using tag.
Can anyone suggest whats the possibility of the cause?
Thank you in advance.
It seems the screenshot is missing from your message.
If by “stack” you mean it looks like the new page is in a modal on top of the current page, it’s maybe a situation where your back-end (e.g. the controller) does not use Inertia::render. Maybe it returns JSON directly, or HTML (using view()).
You can only use <Link> for things handled by Inertia, otherwise you should use a regular <a> tag.
Hi, it's not missing, it just I need to wait more than 1 day to embed an image 😁. Thank you for your suggestion, I'll try to find it.
Add a unique key to your Inertia‐mounted component so Vue unmounts the old page instead of stacking it. In your main template do something like:
Please or to participate in this conversation.