首页 web前端 js教程 怎样操作Vue去除路径中的#号

怎样操作Vue去除路径中的#号

Jun 02, 2018 pm 02:36 PM
去除 路径

这次给大家带来怎样操作Vue去除路径中的#号,操作Vue去除路径中的#号的注意事项有哪些,下面就是实战案例,一起来看一下。

众所周知,vue-router有两种模式,hash模式和history模式。

带#的则是hash模式。

将router中的mode设置为history就可以了

接下来有个问题,界面一刷新,就变404了!!!!

网上搜了下,需要对后端环境进行一个配置。

这里只列举nginx的配置,其他的配置点击这里去官网看

先配置config/index.js

修改assetsPublicPath为根目录

module.exports = {
  build: {
      env: require('./prod.env'),
      index: path.resolve(dirname, '../dist/index.html'),
      assetsRoot: path.resolve(dirname, '../dist'),
      assetsSubDirectory: 'static',
      assetsPublicPath: '/',   // hash 模式会默认的在此处 添加为 assetsPublicPath: './'
      productionSourceMap: true,
      ...
    }
}
登录后复制

然后配置nignx

server {
    listen 0.0.0.0:12345;
    location / {
        root /home/我的应用跟目录;
        try_files $uri $uri/ /index.html =404;  // 这个是重点
    }
    error_page 404 /index.html
}
登录后复制

Url再也没有#了,多完美

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

如何使用vue源码解析事件机制

如何操作JS获取用户所在城市及地理位置

以上是怎样操作Vue去除路径中的#号的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

主题背景位于 Windows 11 中的什么位置? 主题背景位于 Windows 11 中的什么位置? Aug 01, 2023 am 09:29 AM

Windows11具有如此多的自定义选项,包括一系列主题和壁纸。虽然这些主题以自己的方式是美学,但一些用户仍然想知道他们在Windows11上的后台位置。本指南将展示访问Windows11主题背景位置的不同方法。什么是Windows11默认主题背景?Windows11默认主题背景是一朵盛开的抽象宝蓝色花朵,背景为天蓝色。这种背景是最受欢迎的背景之一,这要归功于操作系统发布之前的预期。但是,操作系统还附带了一系列其他背景。因此,您可以随时更改Windows11桌面主题背景。主题背景存储在Windo

如何消除Windows 11上快捷方式的箭头图标 如何消除Windows 11上快捷方式的箭头图标 Dec 28, 2023 am 10:39 AM

很多的用户使用了最新的win11系统之后桌面的快捷图标都出现了一个小箭头很影响美观,所以我们给大家带来了win11快捷方式小箭头去除教程,如果你也觉得不是很好看,就来看看怎么操作吧。win11怎么去除快捷方式小箭头:1、首先,同时按下键盘上面的“win+r”,快捷键。2、然后打开“运行”后,输入“regedit”命令,点击“确定”按钮。3、接下来,就进入“注册表编辑器”页面,点击打开:HKEY_CLASSES_ROOT\lnkfile(可复制粘贴)。4、再进入之后,右击“lsShortcut”选

扫描全能王去除水印怎么去除 扫描全能王去除水印怎么去除 Mar 05, 2024 pm 05:34 PM

去除水印是软件扫描全能王中的一个好用的工具,有些用户还不太清楚扫描全能王去除水印怎么去除,可以在保存界面点击编辑PDF中的去除水印即可闭,接下来就是小编为用户带来的去除水印方法的介绍,感兴趣的用户快来一起看看吧!扫描全能王使用教程扫描全能王去除水印怎么去除答:可以在保存界面点击编辑PDF中的去除水印详情介绍:1、进入软件,点击【相机】图标。2、拍摄扫描需要去水印的文件。3、点击【→】进入下一步。4、完成编辑后,点击【✓】。5、点击其中的【编辑PDF】。6、选择下方的【去除水印】即可。

win11快捷方式箭头如何去除 win11快捷方式箭头如何去除 Jul 05, 2023 pm 02:17 PM

win11快捷方式箭头如何去除?有很多win11用户在在系统桌面创立了快捷方式图标,但是该快捷方式图标上有一个小箭头一样的标志,导致图标整体看起来非常不美观。那么windows11系统快捷图标上的小箭头有没有相应的方法可以去除呢?很多小伙伴不知道怎么详细操作,小编下面整理了win11清除桌面快捷方式小箭头教程,如果你感兴趣的话,跟着小编一起往下看看吧!win11清除桌面快捷方式小箭头教程1、打开菜单栏找到运行或者直win R。2、输入regedit,点击确定。3、定位到HKEY_CLASSES_

斜杠和反斜杠在文件路径中的不同使用 斜杠和反斜杠在文件路径中的不同使用 Feb 26, 2024 pm 04:36 PM

文件路径是操作系统中用于识别和定位文件或文件夹的字符串。在文件路径中,常见的有两种符号分隔路径,即正斜杠(/)和反斜杠()。这两个符号在不同的操作系统中有不同的使用方式和含义。正斜杠(/)是Unix和Linux系统中常用的路径分隔符。在这些系统中,文件路径是以根目录(/)为起始点,每个目录之间使用正斜杠进行分隔。例如,路径/home/user/Docume

如何去除马赛克 马赛克怎样消除 如何去除马赛克 马赛克怎样消除 Feb 22, 2024 pm 03:22 PM

通过仿制图章拾取图片颜色后涂抹即可。教程适用型号:联想AIO520C系统:Windows10专业版版本:Photoshop2020解析1首先进入PhotoShop,打开有马赛克的图片。2在左侧的工具栏中,找到并点击仿制图章。3接着在键盘上长按Alt键。4移动鼠标,在图片中拾取颜色。5然后松开键盘中的Alt键。6最后用鼠标在有马赛克的地方进行涂抹即可消除马赛克。补充:去除马赛克是什么原理1想要去除图片中的马赛克,就相当于在一块画了轮廓的画布上进行作画。虽然色彩方面较好处理,但想要完成仍十分困难。因

如何修复错误:在Java中找不到或加载主类 如何修复错误:在Java中找不到或加载主类 Oct 26, 2023 pm 11:17 PM

由于技术错误,无法播放此视频。(错误代码:102006)本指南提供了针对此常见问题的简单修复,并继续您的编码之旅。我们还将讨论Java错误的原因以及将来如何防止它。什么是Java中的“错误:找不到或加载主类”?Java是一种强大的编程语言,使开发人员能够创建广泛的应用程序。然而,它的多功能性和效率伴随着开发过程中可能发生的一系列常见错误。其中一个中断是错误:找不到或加载主类user_jvm_args.txt,当Java虚拟机(JVM)找不到主类来执行程序时会出现这种情况。此错误充当了障碍,甚至在

轻颜相机怎么去除轻颜的字 轻颜相机怎么去除轻颜的字 Mar 30, 2024 pm 02:51 PM

轻颜相机怎么去除轻颜的字?使用轻颜相机APP拍照会留下轻颜两个字,很多小伙伴不知道如何去除掉轻颜两个字,接下来就是小编为玩家带来的轻颜相机去除轻颜两个字方法教程,感兴趣的玩家快来一起看看吧!轻颜相机使用教程轻颜相机怎么去除轻颜的字1、首先解锁手机进入到桌面,找到【轻颜相机】APP打开进入页面;2、之后跳转到轻颜相机APP主页面,点击左上角【圆形】按钮;3、然后会最顶部会展开多功能菜单栏,选择【相机设置】;4、最后找到下图所示的【水印设置】后方的按钮滑动成暗色即可去除。

See all articles