Как сделать Tabs (табуляция) на inertia vue laravel с подгрузкой данных из базы?

Question

[DocTypeMaster]

Друзья, подскажите как сделать табуляцию с подгрузкой данных из базы. Пользуюсь laravel + inertia vue и хочу в табах выводить разные категории поостов



на скрине просто компонент бутстрапа с табами , вот качестве тайтла таба будет категория а в теле подкатегории.
Вопрос стоит в том как подгружать в тело кнопки не отдельные страницы а просто менять данные

Answer 1

[jazzus]

front:
v-if + ajax
back:
Api resources

Answer 2

[Роман Сарваров]

Если хотите использовать подход Inertia и не хотите чтобы при обращении к методу контроллера грузились сразу все данные, то нужно использовать ленивую загрузку и в JS запрашивать определенные ключи.
Что-то типа:

public function index(TabRepository $repository)
{
    return inertia()->render('Index', [
        'default_tab' => fn () => $repository->getDefaultTabData(), // отдаст по умолчанию и по требованию
        'tab2' => Inertia::lazy(fn () => $repository->getTab2Data()), // отдаст только по требованию
        'tab3' => Inertia::lazy(fn () => $repository->getTab3Data()), // отдаст только по требованию
    ]);
}

<Link class="tab" href="route('blabla')" :only="['default_tab']">default_tab</Link>
<Link class="tab" href="route('blabla')" :only="['tab2']">tab2</Link>
<Link class="tab" href="route('blabla')" :only="['tab3']">tab3</Link>