Как сделать страницу с тремя вкладками на каждой из которых будет своё приложение vue3?

Question

[Nentra]

Vue3. Приложения написаны на Option API.

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

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

Как это сделать?
В какую сторону копать?

Answer 1

[Nentra]

Vue3 Option Api без использования сборщиков.

В итоге сделал вот так
https://snipp.ru/js/vue-js-tabs

Wispik @Wispik
Делаешь 3 блока

Answer 2

[0xD34F]

Не надо заниматься ерундой. Делайте одно приложение, в качестве контента вкладок будут выступать различные компоненты. Как переключаться между ними? - известно как.

чтобы данные не терялись

Не проблема.

Comments

[Nentra]

У меня приложение на Option API.
То есть не на компонентах.

[0xD34F]

Nentra, предлагаю открыть документацию и начать читать - с самого начала и без пропусков. И не останавливаться до тех пор, пока не осознаете, что ваш комментарий - чушь собачья.

Answer 3

[Wispik]

Делаешь 3 блока

<div id="vueapp1"></div>
<div id="vueapp2"></div>
<div id="vueapp3"></div>

Монтируешь свои приложения в эти блоки

Vue.createApp(VueApp).mount('#vueapp1')
...

И 2 из 3 блоков скрываешь, через display: none например

Comments

[Антон Антон]

Причем само скрытие можно попробовать сделать четвертым приложением.

[Wispik]

Антон Антон, тут какой был вопрос, такой и ответ. Человек спросил можно ли так сделать, я сказал, что да. А то, насколько это разумно или нет, пусть сам разбирается

[Nentra]

Wispik,

Человек спросил можно ли так сделать

Я спросил как это сделать

[Wispik]

Nentra, я ответил как сделать