@KBBS

Как правильно использовать во Vue Router полные URL полученные от API?

Добрый день.
Помогите пожалуйста разобраться с вопросом.

Есть апишка написанная на Laravel.
Возникла необходимость создать для неё что-то вроде web-интерфейса, сугубо для внутренних нужд.
В качестве инструментария был выбран Vue и Vue Router.
Но возникли проблемы с использованием. Скорее всего, я что-то делаю не правильно, но не могу понять как решить.

Например. Есть маршрут следующего вида:
{path: '/api/categories', component: CategoriesList, name: 'categories.index'}

Тут всё нормально. При переходе на этот маршрут делаю запрос на сервер, используя this.$route.fullPath, получаю категории.
Api возвращает линки для пагинации вида:
http://example.com/api/categories?page=2
Идея была просто подставлять этот URL в to
<router-link :to="link.url">{{ link.label }}</router-link>

Но при переходе по такой ссылке отображается компонент NotFound. ну и сам url в браузере отображается не правильно. Пример, начиная с hash:
#/api/categories/http://example.com/api/categories?page=2

Подозреваю что проблема в том, что url начинается с http, не со слеша, и роутер воспринимает его как относительный.
Можно ли это как-то побороть? Неужели придётся явно отбрасывать протокол и хост для всех таких url?

И ещё пару вопросов.

Логично использовать /api/ в качестве базового пути.
В конструкторе роутера пишу:
base: '/api/'
Но в роутах всё равно приходится писать:
{path: '/api/categories', component: CategoriesList}

Если я опускаю префикс /api/, то переход осуществляется просто на categories, base из конструктора почему-то не учитывается.
Я пробовал указывать как /categories, так и categories (без слеша), разницы нет.

Если в маршруте будут вложенные маршруты (/api/categories/create), вложенные маршруты необходимо указывать как относительные, или абсолютные?
Например, в объявлении маршрута:
{path: '/api/categories'}
А в массиве children этого маршрута нужно так:
{path: 'create'}
Или так:
{path: '/create'}
?

Спасибо!
  • Вопрос задан
  • 64 просмотра
Пригласить эксперта
Ответы на вопрос 1
Fragster
@Fragster
помогло? отметь решением!
Если я все правильно понял, то полные URL от API имеют отношение только к тем URL, по которым от API нужно получать соответствующие данные.

А то, какие у вас на клиенте маршруты и есть ли они вообще - не соотносится с этими URL в общем случае вообще никак. И использовать эти URL надо в axios (или чем вы там получаете данные от API), а не в router-link
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Artezio Нижний Новгород
от 130 000 до 180 000 ₽
Artezio Москва
от 160 000 до 220 000 ₽
19 янв. 2021, в 00:06
1000 руб./за проект
18 янв. 2021, в 22:36
50000 руб./за проект