你需要开启HTML5 History 模式
vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。
如果不想要很丑的 hash,我们可以用路由的 history 模式,这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。
const router = new VueRouter({
mode: 'history',
routes: [...]
}) 这种配置需要配合后端服务器的配置,如果你对服务器是nginx
location / {
try_files $uri $uri/ /index.html;
}

你们的支持,是我坚持的动力~


 

去掉vue地址栏中分隔#问题的更多相关文章

  1. vue中去掉url地址栏中的#符号

    要去掉vue中访问地址中的#符号可以在路由器中设置路由模式为history: export default new Router({ mode:'history', routes: [ { path: ...

  2. sublime text 3插件改造之AutoFileName去掉.vue文件中img标签后面的width和height,完全去掉!!

    在.vue文件中img标签使用autofilename提示引入文件时,会在文件后面插入宽度高度,如下图: 文件后面会自动插入height和width,其实这两玩意儿在大多数时候并没卵用,然后就开始了百 ...

  3. 如何去掉vue路由中的#

    通过脚手架vue-cli构建的项目,在项目启动后,URL地址上都会带有#,如:http://localhost:8080/#/father 原因:这是因为vue-router 默认hash模式, 使用 ...

  4. 去掉vue 中的代码规范检测(Eslint验证)

    去掉vue 中的代码规范检测(Eslint验证): 1.在搭建vue脚手架时提示是否启用eslint检测的. Use ESLint to lint your code? 写 no; 2.如果项目已经生 ...

  5. 【面试题】如何去掉vue的url地址中的#号?及其原理?

    如何去掉vue的url地址中的#号?及其原理? 点击打开视频讲解更加详细 如何去掉vue的url地址中的#号? import Vue from 'vue'; import VueRouter from ...

  6. vue组件中使用iframe元素

    需要在本页面中展示vue组件中的超链接,地址栏不改变的方法: <template> <div class="accept-container"> <d ...

  7. 前端vue开发中的跨域问题解决,以及nginx上线部署。(vue devServer与nginx)

    前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开 ...

  8. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

  9. vue项目中的常见问题

    总结了几个vue项目开发过程中遇到的常见问题,希望大家注意. 注:文末有福利! 一.样式问题 1.vue中使用less 安装less依赖 npm install less less-loader -- ...

随机推荐

  1. 微信小程序-滚动消息通知效果

    这次我主要想总结一下微信小程序实现上下滚动消息提醒,主要是利用swiper组件来实现,swiper组件在小程序中是滑块视图容器. 我们通过vertical属性(默认为false,实现默认左右滚动)设置 ...

  2. ps-ef|grep-vgrep|grepsep|awk'{print"kill-9"$2}'|sh 这个表达式到底是什么意思啊?

    最佳答案   kill 掉sep这个程序ps -ef | 获取当前服务器所有进程grep -v grep 相当于grep自己吧自己过滤掉,就是不显示grepgrep seq 过滤出seqawk 截取 ...

  3. [js高手之路] es6系列教程 - 对象功能扩展详解

    第一:字面量对象的方法,支持缩写形式 //es6之前,这么写 var User = { name : 'ghostwu', showName : function(){ return this.nam ...

  4. 办公楼[POI2007]

    题目描述 FGD开办了一家电话公司.他雇用了N个职员,给了每个职员一部手机.每个职员的手机里都存储有一些同事的电话号码.由于FGD的公司规模不断扩大,旧的办公楼已经显得十分狭窄,FGD决定将公司迁至一 ...

  5. H5入门——HTML部分

    一.HTML的基本构成 1.<!DOCTYPE html>文档类型声明 <!--HTML的文档类型声明.声明这个文件是HTML5文件,让浏览器按照HTML5准备进行解析显示.文档类型 ...

  6. python几种常见语法

    NO1.type自动匹配类型 name="zhangsan"age=18 print (type(name))#type自动匹配类型 print ("name:%s,ag ...

  7. HDU-2017-字符串统计

    /* Name: HDU-2017-字符串统计 Date: 18/04/17 20:19 Description: 水过 */ #include<bits/stdc++.h> using ...

  8. CSS2--字体样式

    ## CSS2 字体样式 ##### font-family 字体族 - 规定元素的字体系列 - 把多个字体作为一个"回退"系统保存.保证浏览器的支持 - ````Microsof ...

  9. Python 装饰器总结

    装饰器总结 前提 使用装饰器的前提在于Python提供的特性: 函数即对象,可以进行传递: 函数可以被定义在另外一个函数中: 可以通过一个例子来了解: def get_animal(name='dog ...

  10. CSS学习笔记!

    一.关于图像RGB值和像素值的确定! 腾讯QQ截图软件Ctrl+Alt+A进入截图界面,鼠标变成彩色,便会拾取鼠标当前颜色,再按住Ctrl切换到十六进制格式#******.图像的像素值也在截取框内显示 ...