Какой роутинг наиболее грамотный при интеграции Vue.js прямо в Blade-шаблон (через тег script)?

Question

[Роми]

Пытаюсь сейчас изначально понять наиболее удобный путь для создания приложения на Laravel + Vue.js, при котором Vue.js встраивается прямо в Blade-шаблоны (по другому не получается - там много легаси) но данные на страницу тянет через API.

Вот, например, банальный CRUD - как лучше реализовать:

1. Сделать для Read-Update отдельный Blade-шаблон

2. Или на той же странице через какое-нибудь v-show или в модальном окне, например?

А если таких крудов десяток-другой планируется?

Просто хочется сразу сделать оптимально, чтобы потом не переделывать))

А опыта именно такого вот подхода - не имеется.

Если кто уже прошел через это - подскажите как лучше плз. И почему.

Спасибо.

Comments

[bodrych]

остается Вам только посочувствовать) сам с такой архитектурой и легаси работал - сплошная боль

[Роми]

bodrych, ))

Ну, я просто прикинул - делать без Vue вовсе - это еще большая боль))

Answer 1

[Владимир Кудря]

Делайте vue router без history mode, в url будет приписка /#/ и по факту получится обычный spa, ну либо же сделать отдельный раут по типу /my-cool-vue-crud и все что туда будет идти с припиской после будет падать на тот же шаблон, а vue уже сам там поймет куда чего, тут уже с history mode можно работать

Comments

[Владимир Кудря]

что б было нагляднее кидаю пример из своих проектов

//web.php
Route::get('admin/{any?}', 'AdminController@index')->where('any', '.*')->name('adminPanel');

//AdminController
return view('admin.spa');

в admin.spa

<div id="app">
    <router-view />
</div>

ну и собственно обычный vue spa с history mode для раутера

[Роми]

Говоря честно - для меня неожиданно)) я почему-то думал, что vue router для подключения через script - недоступен))

ок, спасибище!

отдельное спасибо за код! (я через код гораздо лучше понимаю)))