栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Vue.js

vue 路由去掉url中的“#”

Vue.js 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

vue 路由去掉url中的“#”

vue-router中默认使用的是hash模式,url中会带有“#”,例如“http://localhost:3000/#/”,
这种情况我们遇到一个问题,就是服务端会在url后面补充参数,我需要拿到这个参数获取信息。

但是有这个“#”,url就变成了“ www.a.com/aaaa?c=1&b=2#¶ms=3”,客户端要用到params这个参数就拿不到了,如果想拿到就需要再处理一下“#”号。再有url上有个“#”也不太美观。

接下来就改了下vue-router的模式

export default new Router({
  mode: 'history',
  base:'/'//如果js和css跟html放在同级,这个也是要指定一下路径的。
})

改成‘history’模式,‘#’就去掉了,很开心。
然而打完包以后,页面是空白页。

然后有修改了下路径


把“assetsPublicPath”修改成你的js和css的路径,默认是“/”根路径,肯定是找不到资源的,也不会把资源放在根路径下。
我把js和css和图片这些静态资源放在cdn的,所以这个地方是一个绝对路径。所以router.js中的base去掉,否则在router调转的时候都会加上遗传base设置的路径。
如果“https://a.com”,调整“https://a.com/aa”
如果base设置了只,比如“/dist”,那你的url就变成了“https://a.com/dist/aa”

当然设置到这里还没有完,还需要你的服务端同事或者it同事设置一下ng

root /Users/qiilee/Desktop/vue/dist; 映射到172.20.x.x:128服务器。

至此就可以愉快的打开没有“#”号的url了。

参考文章:https://www.jb51.net/article/194900.htm

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/239841.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号