spring mvc与vue.js集成，如何使用vue的history模式

DTeam 发布于2019-08-16 10:57 / 1109人阅读

摘要：前言前后台分离的开发模式可以提高效率，方便优化，本文章主要分享如何在已经在中集成了访问模式的情况下，怎么改成的模式集成。

前言

前后台分离的开发模式可以提高效率，方便优化，本文章主要分享如何在已经在spring mvc中集成了vue.js hash#访问模式的情况下，怎么改成vue.js的history模式集成。

部署目录结构

前端(vue.js部分)

主要是两个文件
1.vue.js生产打包配置文件config/index.js中assetsPublicPath为发布到服务器的项目工程根目录

2.路由对象中设置

mode: "history",//访问模式为history，不带#
base: "/NALM",//项目工程根目录

后端(spring mvc部分)

1先说web.xml部分
先设置404错误页面拦截到/index.html(与vue官网配置一个道理，官网上写的是Nginx和Apache的拦截)

2.spring mvc拦截说明
因为我的spring mvc工程为/匹配到Controller里面去这里有一个问题，只配置上面的步骤,这里就会有一个问题，页面请求全部到DispatcherServlet里面去了，需要在mvc的配置文件中声明/index.html和static文件夹为resources就可以了

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/70789.html

关于框架

摘要：事件订阅发布者模式什么是读音类似于是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，采用自底向上增量开发的设计。 MVC && MVVM 前端框架前端 MV*框架的意义被误解的MVC和被神化的MVVM Vue.js新手入门指南单页应用SPA的路由单页面应用的路由问题本文是在自己总结时，看了许多篇文章有了些体会，然后把我认为有意义的摘抄下来，文中很大部分摘录以上...

Richard_Gao 2019-08-20 18:30 评论0 收藏0
SpringBoot-vue 基于Java的微服务全栈快速开发实践

摘要：本项目将使用配合最简单的逻辑来展示一个基于的微服务全栈快速开发实践的。提供一系列大型项目常用的非功能性特征，比如内嵌服务器，安全，指标，健康检测，外部化配置。 SprintBoot-Vue SpringBoot ＋前端MVVM 基于Java的微服务全栈快速开发实践 showImg(https://segmentfault.com/img/remote/1460000010167913...

FleyX 2019-08-21 11:48 评论0 收藏0
SpringBoot-vue 基于Java的微服务全栈快速开发实践

摘要：本项目将使用配合最简单的逻辑来展示一个基于的微服务全栈快速开发实践的。提供一系列大型项目常用的非功能性特征，比如内嵌服务器，安全，指标，健康检测，外部化配置。 SprintBoot-Vue SpringBoot ＋前端MVVM 基于Java的微服务全栈快速开发实践 showImg(https://segmentfault.com/img/remote/1460000010167913...

neu 2019-08-15 10:50 评论0 收藏0
【Vue.js 牛刀小试】：第十二章 - 使用 Vue Router 实现 Vue 中的前端路由控制

摘要：而路由则是使用了中新增的事件和事件。总结这一章主要是介绍了如何使用在中构建我们的前端路由。系列目录地址一、基础知识概览第一章 - 一些基础概念（posted at 2018-10-31）第二章 - 常见的指令的使用（posted at 2018-11-01）第三章 - 事件修饰符的使用（posted at 2018-11-02）第四章 - 页面元素样式的设定（posted a...

cpupro 2019-05-22 19:26 评论0 收藏0
从头开始学习vue-router

摘要：路由模块的本质就是建立起和页面之间的映射关系。这时候我们可以直接利用传值了使用来匹配路由，然后通过来传递参数跳转对应路由配置于是我们可以获取参数六配置子路由二级路由实际生活中的应用界面，通常由多层嵌套的组件组合而成。一、前言要学习vue-router就要先知道这里的路由是什么？为什么我们不能像原来一样直接用标签编写链接哪？vue-router如何使用？常见路由操作有哪些？等等这些问...

tommego 2019-08-23 12:55 评论0 收藏0