vue-router 的URL路径中#的意义
传送门 https://router.vuejs.org/zh-c...
Router 构造配置
routes
类型:
Array<RouteConfig>
RouteConfig
的类型定义:declare type RouteConfig = {
path: string;
component?: Component;
name?: string; // 命名路由
components?: { [name: string]: Component }; // 命名视图组件
redirect?: string | Location | Function;
props?: boolean | string | Function;
alias?: string | Array<string>;
children?: Array<RouteConfig>; // 嵌套路由
beforeEnter?: (to: Route, from: Route, next: Function) => void;
meta?: any; // 2.6.0+
caseSensitive?: boolean; // 匹配规则是否大小写敏感?(默认值:false)
pathToRegexpOptions?: Object; // 编译正则的选项
}
mode
类型:
string
默认值:
"hash" (浏览器环境) | "abstract" (Node.js 环境)
可选值:
"hash" | "history" | "abstract"
配置路由模式:
hash
: 使用 URL hash 值来作路由。支持所有浏览器,包括不支持 HTML5 History Api 的浏览器。history
: 依赖 HTML5 History API 和服务器配置。查看 HTML5 History 模式。abstract
: 支持所有 JavaScript 运行环境,如 Node.js 服务器端。如果发现没有浏览器的 API,路由会自动强制进入这个模式。
现在前端路由的3种模式,常用的是 hash模式(地址有 # 号) 和 history模式 (地址和真实请求没区别)
另外,
#
是 vue-router 使用的hash符号
#!
是 angularjs Route 使用的hash符号
这个无所谓, 有 # 就行(浏览器不会发生页面跳转)
#是hash模式
history模式不带#号,
但部署到服务器的话
hash模式不会出现刷新404问题。。
history模式如果刷新或者直接连接进入某个页面,会提示404。。。
传统方式,后端程序会实际生成一个文件,连接请求能真的找到一个文件。。
这种单页式只有一个html,也不是后端程序不会自动生成文件。。
所以如果用history模式,部署到服务器的时候需要配置虚拟路径
如果请求不到资源的情况下都指向index.html文件
vue-router 的URL路径中#的意义的更多相关文章
- Vue Router 获取url路径参数 query
https://router.vuejs.org/zh/api/#路由对象属性 $route.query 类型: Object 一个 key/value 对象,表示 URL 查询参数.例如,对于路径 ...
- CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器
CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...
- 将map中的查询参数拼装到URL路径中
被调接口的URL路径: //被调接口url String apiUrl = "http://api.open.xxxxxx.com/implatform/interview/send?acc ...
- 解决Java工程URL路径中含有中文的情况
问题: 当Java工程路径中含有中文时,得不到正确的路径 *** 解决: 这其实是编码转换的问题.当我们使用ClassLoader的getResource方法获取路径时,获取到的路径被URLEncod ...
- path-to-regexp快速拆分 url 路径中的参数信息
介绍一个小工具 path-to-regexp 用于快速拆解url path中的部分,贴别适合restful接口中快速获取对应的实体参数 git地址可以参考 https://github.com/pil ...
- 获取url路径中的参数
简介 运用js的时候,我们有时可能会有这样的需求,就是想要获取浏览器地址栏指定的一项参数,形如:https://i.cnblogs.com/EditPosts.aspx?postid=8628413& ...
- java实现从url路径中下载pdf文档到本地
package com.cellstrain.icell.util; import java.io.*;import java.net.*; public class DownloadPdf { /* ...
- Spring MVC-从零开始-@RequestMapping结合@PathVariable (从URL路径中取值,作用于函数参数)
1.可以直接在RequestMapping中value元素中使用{key}描述属性键 2.也可以在{key}中使用正则限定key的取值范围,从而限定url的变化范围 package com.jt; i ...
- 对url路径中的参数进行加密--Java
需求: 后台对一些比较敏感的参数进行数据加密,然后在传送到前端.当前端跳转到后台时,再由后台对其进行解密. 参考 针对url参数的加密解密算法(java版) 修改:对中间的js页面加密代码改写为jav ...
随机推荐
- Python虚拟机之异常控制流(四)
Python虚拟机中的异常控制流 先前,我们分别介绍了Python虚拟机之if控制流(一).Python虚拟机之for循环控制流(二)和Python虚拟机之while循环控制结构(三).这一章,我们来 ...
- Python之多线程与多进程(一)
多线程 多线程是程序在同样的上下文中同时运行多条线程的能力.这些线程共享同一个进程的资源,可以在并发模式(单核处理器)或并行模式(多核处理器)下执行多个任务 多线程有以下几个优点: 持续响应:在单线程 ...
- JS实现——用3L和5L量出4L的水
把以下代码保存成donglanguage.html文件,使用Google或360浏览器打开 <!DOCTYPE html> <html> <head> <me ...
- 02_ThreadLocal语法与源码分析
文章导读: 早在JDK 1.2的版本中就提供Java.lang.ThreadLocal,ThreadLocal为解决多线程程序的并发问题提供了一种新的思路.使用这个工具类可以很简洁地编写出优美的多线程 ...
- rocketmq源码分析1-benchmark学习
benchmark 分析 组成部分 三个java类,都含有main方法,可选的传递一些参数,诸如测试线程数量,消息体积大小.三个类分别用于测试普通生产者,事务生产者,消费者.生产者 默认64个测试线程 ...
- PHP全栈开发
DAY01_PHP基础第一天 01.了解php 00:09:26 ★ 02.php的开发环境准备 00:13:47 ★ 03.人人都会编程 00:10:26 ...
- Oracle实例和数据库区别
什么是数据库,其实很简单,数据库就是存储数据的一种媒介.比如常用的文件就是一种,在Oracle10G中,数据的存储有好几种.第一种是文件形式,也就是在你的磁盘中创建一批文件,然后在这些文件 ...
- JavaScriptCore 简介
转自http://esoftmobile.com/2013/06/19/integrating-javascript-into-native-applications/ Integrating Jav ...
- 使用ssh建立隧道和web代理
动态端口转发(socket4/5代理): 通过ssh监听本地端口并把数据转发至远程动态端口 转发local port 至 ssh Server ssh -D ssh -qfTnN -D 本地目标端口 ...
- iOS-多线程(2)
多线程之NSOperation: 多线程的优点: 使用线程可以把占据时间长的程序中的任务呀放到后台去处理 用户界面可以更加吸引人,这样比如用户点击了一个按钮去触发某些事件的处理,可以弹出一个进度条来显 ...