时间戳

首页 > 解决方案 > 在 URL 中添加 slug

vue.js - 在 URL 中添加 slug

问题描述

我在 IIS 中托管一个 Vue SPA。

我正在使用 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 },
];

在 Web 服务器中，我将文件放在目录中：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。如何将 slug 添加/dev/myapplication/到 URL？

当此应用程序进入测试服务器时，slug 将是/test/myapplication，而在生产中它将是/regionaloffice/myapplication.

标签： vue.jsiisvue-router

解决方案

尝试在构造函数中使用 base 选项：

类型：字符串

默认： ”/”

应用程序的基本 URL。例如，如果整个单页应用程序在 /app/ 下提供服务，那么 base 应该使用值“/app/”

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

推荐阅读