vue项目中地址带‘#’的问题

最新推荐文章于 2024-06-23 12:22:42 发布
最新推荐文章于 2024-06-23 12:22:42 发布
阅读量2k 收藏 1
点赞数
分类专栏： js 文章标签： Vue Vue Router history模式 路由配置 前端开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45646663/article/details/121292875
版权

修改router中的index.js中的
mode: ‘history’,

export default new Router({
  linkActiveClass: 'nav-menus-active',
  transitionOnLoad: true,
  hashbang: false,
  history: true,
  mode: 'history',  //把Router的mode修改为history模式,VueRouter默认的模式为HASH模式
靓靓的圆子
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 地址栏#号前随意输入字符问题
weixin_45753961的博客
06-17 466
问题： 地址栏#号前随意输入字符，也能跳转页面使用，有些接口能用。但是有些接口404。 解决方法： 在路由拦截增加这段判断： // 判断#号前的地址是否正确 let wPath = window.location.href; //页面地址 let currentHost = wPath.substring(0,wPath.indexOf("#")); //页面#号前的地址 // 获取主机地址，如：http://localhost:8080/ let realHost = window.location
vue 项目遇到的问题
ZQ的专栏
06-06 1649
1、Module not found: Error: Can't resolve 'stylus-loader' in...<style lang="stylus" rel="stylesheet/stylus">   #app     .tab   display:flex   width: 100%   height: 40px   line-height: 40p...
vue路由去除 链接 / 前面的 #
前端程序猿的博客
12-29 439
删除链接#
Vue3-尚硅谷笔记
最新发布
dekudekuku的博客
06-23 1357
修改名字
解决vue-router进行路由导航时，浏览器地址栏中的 #
在下魔王ii的博客
09-21 642
修改index.js中所实例化的router，举个栗子 import Vue from 'vue' import VueRouter from 'vue-router' constroutes=[{ path:'/', redirect:'/login' }, { path:'/login', name:'Login', component:Login }] const router = new VueRouter({ /* vue...
vue-router中的#
feiyu_may的博客
09-11 3441
    vue工程搭建完成后，我们运行在浏览器中打开，会发现url中多了一个#符号，     有#是使用URL hash模式的缘故，#代表网页中的一个位置，右边的字符就是该位置的标识符，从#开始的部分就是URL的锚部分，vue-router默认的是hash模式，如果觉得#在url中影响美观，可以更改为history模式。     history模式不带#号，需要服务器配置。     前端...
浅谈vue项目,访问路径#号的问题
10-14
Vue.js 是一个流行的前端JavaScript框架，用于构建用户界面。在Vue项目中，你可能会遇到URL中包含"#/"的情况，这与Vue Router的默认工作模式有关。...希望这些信息能帮助你更好地理解和解决Vue项目中的路径问题。
vue 项目地址去掉 #的方法
10-17
总之，要去掉 Vue 项目的 URL 中的 `#` 符号，需要将 `vue-router` 的模式设置为 `history`，同时配合后端服务器的重写规则配置，确保所有非静态资源请求都被导向 `index.html`。配置完成后，用户将看到更加友好的 ...
完美解决通过IP地址访问VUE项目的问题
10-15
本文将详细介绍如何完美解决通过IP地址访问Vue项目的问题。 首先，我们需要对Vue项目的配置文件进行更改。在Vue项目中，配置文件通常是`config/index.js`。在这里，我们将`host`设置为`0.0.0.0`，这使得服务器监听...
【Vue】去掉默认地址栏的#以及后续问题
coralime的博客
02-24 2092
启动vue项目后，地址栏会默认带一个# 原因是vue-router提供了两种模式，一种Hash模式（默认），一种History模式。 vue-router 默认为 hash 模式，当 URL 改变时，页面不会重新加载，只是根据 hash 来更换显示对应的组件，这就是所谓的单页面应用。 在Hash模式下路由地址会默认带一个#，修改成History模式就行了。 在/router/index.js页面下，修改mode方式 const router = new VueRouter({ mode:
vue获取微信登陆权限_微信公众号网页授权--前端获取code及用户信息（vue）
weixin_39734646的博客
12-19 4610
前段时间开发微信公众号网页授权，虽然网上已经有很多关于这方面的博客或者教程，但是第一次开发还是遇到挺多坑的，以下分享一下我的踩坑填坑之路。一、测试号相关配置首先在你公司申请的测试号上配置好相关信息，这里直接上图吧： URL与Token都是要后台配置好的，直接叫后台给过来就好啦，域名一定要和URL的域名保持一致。然后，在体验接口权限表里面找到网页帐号--网页授权获取用户基本信息，点击修改： 配置授权...
解决vue项目访问地址自动添加#号问题
Feb_ruary的博客
07-25 7053
新建一个vue项目，访问地址url后自动添加#号，很不美观。
Vue项目路由路径中去掉#
m0_67587248的博客
01-09 2109
在Vue中，有两种常见的路由模式：哈希模式（Hash Mode）和历史模式（History Mode）。要在Vue项目中选择路由模式，在创建Vue Router实例时，可以通过。
Vue项目运行路由总会带#，一行代码搞定！
盖世小可爱的博客
09-03 1698
一、问题 使用VUE路由，项目的url总是带有#，如下： http://localhost:8066/#/ 二、解决 修改路由文件中 index.js 文件，即 src --> router --> index.js没修改前： export default new Router({ routes: [ { path: '/', name: 'LoginView', component: LoginView } ] }) ...
vue项目页面地址自动添加#号的问题
热门推荐
qq_27474555的博客
07-31 1万+
vue项目页面地址自动添加#号的问题 1、原因 vue路由默认是hash，改成history模式 2、方法 配置路由模式，例如： export default new Router({ mode: 'history', routes: [{ path: '/', name: 'Hello', component: Hello }] }) }) 3、后续问题处...
Vue URL哈希模式下参数拼接在#前面问题
ddd
08-04 4334
问题发现是在做授权时给后端一个回调地址，当回来就发现参数拼在#前面导致取不到query值。使用 earchParams.get() 取值 如果没有该参数 返回值为 null。使用new URL()后得到以下信息对地址重新拼接后改变url。别使用哈希模式，改为历史模式，接下来的事交给后端解决吧。这条博客是有关this.$route.query取不到值...
最详细的js获取当前url的方法
你若为我繁华，我愿成你烟花
11-14 1565
1、window.location.href(设置或获取整个 URL 为字符串) var test = window.location.href; alert(test); 返回：http://i.cnblogs.com/EditPosts.aspx?opt=1 2、window.location.protocol(设置或获取 URL 的协议部分) var test = window.loc...
Vue 实现截取网络地址字符串携带的参数
LONGYog的博客
05-03 638
Vue 实现截取网络地址字符串携带的参数 实现效果，如图： HTML代码： <template> <div> <div style="background-color: #f4f4f4;margin:50px 0 0 460px;width:900px;height:300px;"> <p>截取前：{{ testurl }}</p> <p>截取后(转为对象)：{{
vue项目去掉地址#导致页面无法跳转
05-25
如果你想要去掉 Vue 项目中的地址栏中的 #，可以使用 Vue Router 的 history 模式。 在使用 history 模式前，请先确保你的服务器已经正确地配置了 URL 重写，否则在用户在直接访问项目时会出现 404 错误。 接下来...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值