VueJS找不到Django -页面

Question

我试图在Django项目中创建一个带有Vue的SPA，这样Django只处理身份验证模板，其余的前端完全是webpack-loader呈现的Vue，所以是Django呈现的Vue应用程序。我这样做是为了避免完全由Django处理身份验证的好处。

因此，/accounts/以下的所有内容都将由Django视图呈现的django模板处理，而/app/以下的所有内容将由Vue应用程序处理。

我有以下几点：

urlpatterns = [
    # Some standard django templates url here for authentication..
    # ...
    # The Vue app:
    path('app/', views.vueApp, name='vueApp'),
]

因此，当用户导航到mysite.com/app时，Vue将将整个前端处理为带有其路由的SPA：

//main.js
const router = new VueRouter({
  base: '/app',
  mode: 'history',
  routes: [
    { path: '/', component: Home },
    { path: '/test1', component: testcomponent },
    { path: '/test2', component: test2component }
  ]
})

我的代码的问题是，如果我单击指向test1的链接或从到 an the Vue应用程序，我将被重定向到testcomponent (mysite.com/app/test1)和test2component (mysite.com/app/test2)；相反，如果我打开浏览器并直接导航到mysite.com/app/test1或< code >D14，我将得到Django未找到的页面，我认为是因为Django认为我试图达到一个标准的Django url，而不是我的Vue应用程序处理的URL。

有什么办法解决这个问题吗？提前感谢！

Answer 1

为了处理这个问题，您需要一条捕获所有的路径，以确保您在url中捕获了/之后的所有内容。否则看起来你的url不匹配。您需要这样的东西(如果您使用regex来匹配)：

path('app/?.*$', views.vueApp, name='vueApp'),

这应该与从app/开始的所有东西相匹配，并且在它之后还有其他的东西。您并不关心在django bc中捕获这些内容，vue路由器将从那时开始处理它。

埃塔:如果你不使用regex，我想你可以使用这种格式来接受斜杠之后的任何内容：

path('app/<path:rest_of_path>', views.vueApp, name='vueApp'),