在使用Vue搭建前端服务器时,路由出现#号的解决办法
路由模式解析
这里要讲vue-router的路由模式,首先要了解的一点就是路由是由多个URL组成的,使用不同的URL可以相应的导航到不同的位置。如果有进行过服务器开发或者对http协议有所了解就会知道,浏览器中对页面的访问是无状态的,所以我们在切换不同的页面时都会重新进行请求。而实际使用vue和vue-router开发就会明白,在切换页面时是没有重新进行请求的,使用起来就好像页面是有状态的,这是什么原因呢。这其实是借助了浏览器的History API来实现的,这样可以使得页面跳转而不刷新,页面的状态就被维持在浏览器中了。
Vue-router的三种模式
Hash: 使用URL的hash值来作为路由。支持所有浏览器。
History: 以来HTML5 History API 和服务器配置。参考官网中HTML5 History模式
Abstract:支持所有javascript运行模式。如果发现没有浏览器的API,路由会自动强制进入这个模式。
vue-router默认使用的是hash模式,这就会出现如下URL:

解决方法
只需要将router文件下的index.js(创建方式不同,也可能是router.js)中的如下代码位置修改为history模式即可。

在使用Vue搭建前端服务器时,路由出现#号的解决办法的更多相关文章
- 初学vue 在做项目时遇到的问题与解决办法(使用element组件)(二)
表格每行里都有按钮 <el-table-column prop="option" label="操作" align="center" ...
- 在centos搭建git服务器时,不小心把/home/git目录删除了,我是怎么恢复的
在centos搭建git服务器时,不小心把/home/git目录删除了,我是怎么恢复的 在删除掉/home/git目录后,每次 git push提交时,都让填写密码,烦 第一步:在本地找到id_rsa ...
- 爬虫爬数据时,post数据乱码解决办法
最近在写一个爬虫,目标网站是:http://zx.bjmemc.com.cn/,可能是为了防止被爬取数据,它给自身数据加了密.用谷歌自带的抓包工具也不能捕获到数据.于是下了Fiddler. F ...
- 返回xml过长时被nginx截断的解决办法
返回xml过长时被nginx截断的解决办法 问题描述:通过网页获取数据,数据格式为xml.当xml比较短时,可以正常获取数据.但是xml长度过长时不能正常获取数据,通过观察返回数据的源代码,发现xml ...
- HTML5服务器推送消息的各种解决办法,html5服务器
HTML5服务器推送消息的各种解决办法,html5服务器 摘要 在各种BS架构的应用程序中,往往都希望服务端能够主动地向客户端推送各种消息,以达到类似于邮件.消息.待办事项等通知. 往BS架构本身存在 ...
- Bootstrap中关闭第二个模态框时出现的问题和解决办法
Bootstrap中关闭第二个模态框时出现的问题和解决办法 1.关闭第二个模态框时,第一个模态框跟着消失. 解决办法: 第二个模态框的代码不要写在第一个模态框里面,确保两个模态框相对独立; 2.关闭第 ...
- oracle执行update语句时卡住问题分析及解决办法
转载:http://www.jb51.net/article/125754.htm 这篇文章主要介绍了oracle执行update语句时卡住问题分析及解决办法,涉及记录锁等相关知识,具有一定参考价值, ...
- IDEA使用maven构建时控制台中文乱码的解决办法
使用maven clean install 项目时控制台中文乱码,解决办法如下: Setting->maven->runner VMoptions: -Dfile.encoding=UTF ...
- mongodb 更新数据时int32变为double的解决办法 & 教程
https://www.runoob.com/mongodb/mongodb-mongodump-mongorestore.html mongodb 更新数据时int32变为double的解决办法 ...
随机推荐
- Excel中使用VBA访问Access数据库
VBA访问Access数据库 1. 通用自动化语言VBA VBA(Visual Basic For Application)是一种通用自动化语言,它可以使Excel中的常用操作自动化,还可以创建自定义 ...
- logback与log4j比较
摘自:https://www.cnblogs.com/smile361/p/7592684.html logback与log4j比较 更快的执行速度: 基于我们先前在log4j上的工作,logback ...
- [欣赏代码片段] (JavaScript) 你使用过getComputedStyle没有
(function() { // IE8 ployfill for GetComputed Style (for Responsive Script below) if (!window.getCom ...
- centos7用fdisk进行分区
1.查看分区信息:fdisk -l 从上面可以看到,/dev/sdb分区还没有使用,现在将其划分成2个10G的分区. 2.执行:fdisk /dev/sdb 1):fdisk命令参数 p:打印分区表. ...
- yii2 gridview 新增按钮 动态显示按钮
新增一个按钮 [ 'class' => 'yii\grid\ActionColumn', 'header' => '操作', 'options' => ['width' => ...
- 【转载】Redis优化经验
转载地址:http://blog.sina.com.cn/s/blog_4be888450100z2ze.html 内存管理优化 Redis Hash是value内部为一个HashMap,如果该Map ...
- GithubPage自定义腾讯404界面
思路来源 之前看到腾讯网络的404和github自带的404,反差很大,于是想自己弄一个了. 过程 github的404一点也不复杂,只是需要在根目录添加一个404.html的文档,或者404.md的 ...
- How To Start Building Spatially Aware Apps With Google’s Project Tango
How To Start Building Spatially Aware Apps With Google’s Project Tango “Tango can enable a whole new ...
- spark介绍2
上述结果是 map 1 filter 1 map 2 filter 2 map 3 filter 3 map 4 filter 4 即说明是并行,且互不干扰,每个task运行到最后
- UVA - 12424 Answering Queries on a Tree(十棵线段树的树链剖分)
You are given a tree with N nodes. The tree nodes are numbered from 1 to N and have colors C1, C2,. ...