Vue如何实现hash模式网址(就是那种带#的网址、井号url)

简介: Vue如何实现hash模式网址(就是那种带#的网址、井号url)

src\js\main.js

...
const router = new VueRouter({
...
     mode: 'hash', //hash模式网址,带#井号
  // mode: 'history', // 这里存在一个弊端,如果要去掉路由的#号,需要后端配合配置,否则刷新页面就会报错404,反正如果不是非得要做支付建议不用这个参数配置,参考文档:https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E5%90%8E%E7%AB%AF%E9%85%8D%E7%BD%AE%E4%BE%8B%E5%AD%90
...
});
...

hash模式下网址形如

http://127.0.0.1/#/home

http://localhost/#/home

扩展阅读→Angular如何实现hash模式网址

image.png


相关文章
|
2月前
|
JavaScript 前端开发 网络架构
vue 路由器history和hash工作模式
vue 路由器history和hash工作模式
|
2月前
|
JavaScript 数据可视化
vue-cli学习二:vue-cli3版本 创建vue项目后,Runtime-Compiler和Runtime-only两个模式详解;vue项目管理器;配置文件的配置在哪,以及如何配置
这篇文章详细介绍了Vue CLI 3版本创建项目时的Runtime-Compiler和Runtime-only两种模式的区别、Vue程序的运行过程、render函数的使用、eslint的关闭方法,以及Vue CLI 2和3版本配置文件的不同和脚手架3版本创建项目的配置文件配置方法。
85 3
vue-cli学习二:vue-cli3版本 创建vue项目后,Runtime-Compiler和Runtime-only两个模式详解;vue项目管理器;配置文件的配置在哪,以及如何配置
|
1月前
|
JavaScript 前端开发 索引
JavaScript获取url网址中域名后面的部分
如何截取 url 中网站域名之后的部分,需要用到以下几个方法:
83 3
|
1月前
|
JavaScript
vue封装一个查询URL参数方法
通过以上步骤,我们在Vue.js项目中封装了一个查询URL参数的方法 `getQueryParam`,并在Vue组件中成功应用。这种封装方式不仅提高了代码的复用性,还使得代码更加清晰和易于维护。
17 1
|
1月前
|
JavaScript
vue封装一个查询URL参数方法
通过以上步骤,我们在Vue.js项目中封装了一个查询URL参数的方法 `getQueryParam`,并在Vue组件中成功应用。这种封装方式不仅提高了代码的复用性,还使得代码更加清晰和易于维护。
16 1
|
2月前
url重写重定向所有http网址到https网址
url重写重定向所有http网址到https网址
37 4
|
4月前
|
JavaScript 前端开发 搜索推荐
Vue 路由的hash模式和history模式有什么区别?
在Vue.js框架中,路由管理是单页面应用(SPA)不可或缺的功能。Vue 路由提供了两种模式:hash模式和history模式,这两种模式主要负责处理URL的变更而无需重新加载整个页面,实现前端路由的功能。
240 19
|
4月前
|
设计模式 JavaScript 前端开发
Vue.js组件设计模式:构建可复用组件库
在Vue.js中,构建可复用组件库是提升代码质量和维护性的核心策略。采用单文件组件(SFC),定义props及默认值,利用自定义事件和插槽进行灵活通信,结合Vuex或Pinia的状态管理,以及高阶组件技术,可以增强组件的功能性和灵活性。通过合理的抽象封装、考虑组件的可配置性和扩展性,并辅以详尽的文档和充分的测试,能够打造出既高效又可靠的组件库。此外,采用懒加载、按需导入技术优化性能,制定设计系统和风格指南确保一致性,配合版本控制、CI/CD流程和代码审查机制,最终形成一个高品质、易维护且具有良好社区支持的组件库。
75 7
|
4月前
|
JavaScript Linux 应用服务中间件
【Azure 应用服务】FTP 部署 Vue 生成的静态文件至 Linux App Service 后,访问App Service URL依旧显示Azure默认页面问题
【Azure 应用服务】FTP 部署 Vue 生成的静态文件至 Linux App Service 后,访问App Service URL依旧显示Azure默认页面问题
|
4月前
|
设计模式 JavaScript 前端开发
Vue.js 组件设计模式:在前端热潮中找到归属感,打造可复用组件库,开启高效开发之旅!
【8月更文挑战第22天】Vue.js 以其高效构建单页应用著称,更可通过精良的组件设计打造可复用组件库。组件应职责单一、边界清晰,如一个显示文本并触发事件的按钮组件,通过 props 传递标签文本,利用插槽增强灵活性,允许父组件注入动态内容。结合 CSS 预处理器管理和封装独立模块,配以详尽文档,有效提升开发效率及代码可维护性。合理设计模式下,组件库既灵活又强大,持续实践可优化项目工作流。
56 1