springboot vue history路由

Spring Boot 是一个用于构建 Java 应用程序的开发框架，而 Vue 是一个流行的 JavaScript 框架，用于构建用户界面。在使用 Spring Boot 和 Vue 开发应用程序时，你可以使用 Vue 的 history 路由模式来实现前端路由。

Vue 的 history 路由模式允许在不刷新页面的情况下进行路由切换。它依赖于 HTML5 的 history API，可以通过修改浏览器的 URL 来实现路由切换。相比于 hash 路由模式，history 路由模式的 URL 看起来更加友好，没有 "#" 符号。

要在 Spring Boot 中使用 Vue 的 history 路由模式，你需要进行以下步骤：

1. 在 Vue 项目中配置 history 路由模式。可以通过在 `router/index.js` 文件中添加 `mode: 'history'` 来启用 history 模式。

import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/views/Home.vue'

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    // 其他路由配置...
  ]
})

2. 配置 Spring Boot 后端来支持 history 路由模式。在 Spring Boot 中，你可以通过配置 `WebMvcConfigurer` 来处理前端路由。

@Configuration
public class WebMvcConfig implements WebMvcConfigurer {

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/{spring:\\w+}")
                .setViewName("forward:/");
        registry.addViewController("/**/{spring:\\w+}")
                .setViewName("forward:/");
        registry.addViewController("/{spring:\\w+}/**{spring:?!(\\.js|\\.css)$}")
                .setViewName("forward:/");
    }

    @Override
    public void configurePathMatch(PathMatchConfigurer configurer) {
        configurer.setUseSuffixPatternMatch(false);
    }
}

上述代码中的 `WebMvcConfig` 类配置了三个视图控制器，将所有匹配到的 URL 都转发到根路径，以便 Vue 的路由能够处理。`configurePathMatch` 方法用于禁用后缀模式匹配。

通过上述配置，当在 Vue 中使用 history 路由切换时，Spring Boot 会将前端路由的请求转发到 Vue 的入口，然后 Vue 会根据配置的路由规则进行相应的展示。

希望以上信息对你有所帮助！如果你还有其他问题，请随时提问。