vue+asp.net Web api前后端分离项目发布部署

Vue 3.0 和 ASP.NET Core WebAPI 都支持动态路由，实现起来也比较简单。 首先，在 ASP.NET Core WebAPI 中，我们需要在 Startup.cs 中配置路由。可以使用以下代码： ``` app.UseEndpoints(endpoints => { endpoints.MapControllerRoute( name: "default", pattern: "{controller}/{action}/{id?}"); }); ``` 这个配置会将请求转发到对应的控制器和方法中。其中，{controller} 和 {action} 表示控制器和方法名，{id?} 表示可选参数。 接着，在 Vue 3.0 中，我们可以使用 vue-router 实现动态路由。可以使用以下代码： ``` const router = createRouter({ history: createWebHistory(), routes: [ { path: '/:controller/:action/:id?', name: 'dynamic', component: DynamicComponent } ] }) ``` 这个配置会将请求转发到 DynamicComponent 组件中。其中，:controller、:action 和 :id? 表示控制器、方法名和可选参数。 最后，我们可以在 DynamicComponent 组件中调用 ASP.NET Core WebAPI 中的动态路由。可以使用以下代码： ``` axios.get(`/api/${this.$route.params.controller}/${this.$route.params.action}/${this.$route.params.id}`) .then(response => { // 处理响应 }) .catch(error => { // 处理错误 }) ``` 这个代码会发送请求到对应的控制器和方法中，其中，this.$route.params.controller、this.$route.params.action 和 this.$route.params.id 分别对应控制器、方法名和参数。 以上就是 Vue 3.0 和 ASP.NET Core WebAPI 实现动态路由的基本步骤。