Блог

Главная - Вопросы по программированию - Добавьте пули в URL-адрес

Добавьте пули в URL-адрес

#vue.js #iis #vue-router

Вопрос:

Я устраиваю СПА-салон Vue в IIS.

Я использую VueRouter, и в моих маршрутах у меня есть:

 const routes = [
    { path: '/', name: 'Home', component: Home },
    { path: '/customers', name:'customers', component: Customers },
    { path: '/qadcustomers', name:'qadcustomers', component: QadCustomers },
    { path: '/customer/:id?', name:'customer', component: Customer, props: true },
    { path: '/qadcustomer/:id?', name:'qadcustomer', component: QadCustomer, props: true },
    { path: '/import', name:'import', component: Import },
];

На веб-сервере я помещаю файлы в каталог: inetpub/wwwroot/dev/myapplication

Я бы хотел, чтобы доступ к приложению осуществлялся по адресу:

https://myserver/dev/myapplication/ <— Это позволит перейти на главную

https://myserver/dev/myapplication/customers <- Это пойдет для клиентов

https://myserver/dev/myapplication/qadcustomers <- Это пойдет на QadCustomers

Что происходит сейчас , так это то, что вся моя страница находится на https://myserver/customers , или https://myserver/qadcustomers . Как добавить пули /dev/myapplication/ в URL-адрес?

Когда это приложение отправится на тестовый сервер, пуля будет /test/myapplication , и в производстве она будет /regionaloffice/myapplication .

Комментарии:

1. попробуйте использовать базовую опцию в конструкторе router.vuejs.org/api/#base

2. @JalpaPanchal Спасибо! Не знал, что есть опция «базовый». Я закончил тем, что использовал это, работает идеально

3. опубликовал предложение. Если ваша проблема решена, я прошу вас отметить полезное предложение в качестве ответа. Это поможет другим людям, которые сталкиваются с той же проблемой.

Ответ №1:

попробуйте использовать базовую опцию в конструкторе:

тип: строка

по умолчанию: «/»

Базовый URL-адрес приложения. Например, если все одностраничное приложение обслуживается в разделе /app/, то база данных должна использовать значение «/app/».

https://router.vuejs.org/api/#linkactiveclass

Ответ №2:

Вы можете использовать Вложенные маршруты — маршрутизатор Vue

 const router = new VueRouter({
  routes: [
    {
      path: '/dev/myapplication',
      component: MyApplication,
      children: [
        {
          path: 'route1',
          component: Route1
        },
        {
          path: 'route2',
          component: Route2
        }
...

Он добавит /dev/myapplication префикс для всех маршрутов.

Таким образом, ваши маршруты будут выглядеть следующим образом:

  • /dev/myapplication/route1
  • /dev/myapplication/route2
  • /dev/myapplication/route3
Метки: