Question

我有一个laravel + vue应用程序。我已经为称为shop的特定页面创建了vue spa应用程序。在这家商店中，我有3个关于产品，联系方式的子页面。

routes.php

Route::get('/shop/{slug}/{vue_capture?}', 'ShopController@show')->where('vue_capture', '[\/\w\.-]*');

vue-router.js

export const routes = [
  { path: '/', component: Home, name: 'home',
    children: [
      {
        path: '/',
        name: 'about',
        component: About
      },
      {
        path: '/products',
        name: 'products',
        component: Product
      },
      {
        path: '/contact',
        name: 'contact',
        component: Contact
      } 
    ]
  },
];

例如，我去domain.com/shop/joe-shop，什么是提取段塞并将其在vue应用程序中使用的最佳实践是什么，以便可以向服务器发出带有段塞参数的http请求？谢谢

注意：我还在我的应用程序中使用vuex状态管理

Answer 1

var slug = window.location.pathname.replace(/^\/shop\/([^\/]+)(?:\/.*)?/i,'$1');

注意：

在当前设置下，您需要在vue-router配置中设置base属性，以使其正常运行。

new Router({
    base: window.location.pathname.replace(/^(\/shop\/[^\/]+).*/i,'$1'),
    mode: 'history',
    routes: ...
})

Laravel + Vue路由器-的最佳做法

1 个答案: