Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

RobTheDev's avatar

InertiaJS + Vue3 - issues with tabbed content and prop updating

Hey,

I know some parts of my problems have been discussed here on the forum but what. I found it didn't help.

I have setup like that:

  • DashboardController - on initial page loads I'm grabbing a few items out of DB and displaying it on the screen, works fine.
  • GoalsController - I have there methods for updating, adding etc - works fine.
  • I have on my Dashboard component 3 tabs, upon click what happens now I am adding query param and retrieving data filtered by that param.

I have couple of issues.

First off - I can't seem to preserve URL. When I am on any tab and click a button to update something on one of the displayed items inertia does that and item is updated, request goes off to the GoalsController but I think it causes the page to reload and URL goes away.

/**
     * Update the goal.
     *
     * @param UpdateGoal $request
     * @return RedirectResponse
     */
    public function update(UpdateGoal $request): RedirectResponse
    {
        $this->goalsRepository->update($request->only([
            'id',
            'title',
            'public',
            'description',
            'completed',
            'endDate'
        ]));

        if ($request->has('completed') && $request->completed) {
            Session::flash('message', 'Congratulations, your goal is now visible in the "Achievements" tab!');
        } else {
            Session::flash('message', 'Goal updated successfully!');
        }

        return to_route('dashboard');
    }

The second issue is that when I display content in any of the tabs after a successful request for updating content it doesn't refresh the page props. Updated props are returned and I even tried doing stuff like

const page = usePage();
const goals = computed(() => page.props.goals)

So I am making a put request router.put() and DB updates just fine but no reactivity and it looks like whenever I get some it all causes a full page reload.

Makes me think Inertia is just not the right tool but so many people say it is so great that it also makes me think I am doing something wrong.

It looks like if I want to have reactivity without page reload I have the create separate controllers for each tab? As in making them separate pages? That seems a bit insane.

Is there anything obvious I am doing wrong? I've seen statements claiming inertia apps don't need endpoints and API but looks like this is not true.

0 likes
0 replies

Please or to participate in this conversation.