在使用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的解决办法 ...
随机推荐
- jquery UI datepicker汉化
由于近期工作需要,jquery ui的datepicker需要汉化,特此把代码贴在这$(function() { $.datepicker.regional["zh-CN"] = ...
- JavaScript中的shift()、unshift()和pop()函数
JavaScript中的shift()和pop()函数 1.shift()函数 定义 该函数从从数组中删除第一项,并返回该删除项. 用法示例 var fruits = ["Banana& ...
- unity 小地图的制作
利用 Transform.InverseTransformDirection 变换位置从世界坐标到自身坐标. 以第一人称控制器为坐标原点(忽视y轴),x轴z轴转为屏幕坐标. 若物体在地图范围外,可以 ...
- APUE(4)---文件和目录 (3)
十三.函数rename和renameat #include <stdio.h> int rename(const char *oldname, const char *newname); ...
- set集合排序
不仅list是有序集合,set也可以变为有序集合. /** * 给字符串时间的set排序 * @return 有序的set集合 */ public static Set getSort(){ Set& ...
- node后台启动
node启动后会占用当前shell 后台启动方式: 1.用forever进行管理 npm install -g forever forever start index.js 2.使用nohub命令 ...
- vsftpd安装与配置--研究tcp与防火墙
vsftpd的配置文件 /etc/vsftpd/vsftpd.conf 主配置文件 /usr/sbin/vsftpd Vsftpd的主程序 /etc/rc.d/init.d/vsftpd 启动脚本 / ...
- jQuery获取各种input输入框的值
1.获取一组radio单选框的值(name属性为一组的radio的name属性) var q1 = $("input[name=element_name]:checked").va ...
- c3p0-数据库连接池原理
一直用c3p0很久了,但也没时间或没主动去研究过,直到最近频频在出现一些莫名其妙的问题,觉得还是有必要了解和研究一下. c3p0是什么 c3p0的出现,是为了大大提高应用程序和数据库之间访问效率的. ...
- 爬虫--使用scrapy爬取糗事百科并在txt文件中持久化存储
工程目录结构 spiders下的first源码 # -*- coding: utf- -*- import scrapy from firstBlood.items import Firstblood ...