vue hash模式和404页面的配置
1.设置我们的路由配置文件(/src/router/index.js):
{
path:'*',
component:Error
}
这里的path:’*’就是找不到页面时的配置,component是我们新建的一个Error.vue的文件。
2.新建404页面:
<template>
<div>
<h2>{{ msg }}</h2>
</div>
</template>
<script>
export default {
data () {
return {
msg: 'Error:404'
}
}
}
</script>
已经实现404页面的效果。
mode的两个值
- histroy:当你使用 history 模式时,URL 就像正常的 url,例如 http://www.baidu.com/lms/,也好看!
- hash:默认’hash’值,但是hash看起来就像无意义的字符排列,不太好看也不符合我们一般的网址浏览习惯。
vue hash模式和404页面的配置的更多相关文章
- vue+webpack 打包文件 404 页面空白
最近用vue-cli+vue-router+webpack建立项目,其中的遇到的三个问题,整理如下: vue-cli+ webpack 建立的项目,cnpm run build 打包项目之后,需要放在 ...
- vue hash模式下微信分享后打开首页,三种完美解决方案
微信分享功能给我们带来了很大的便利,使得基于微信开发出来的 H5 页面可以很好的通过微信平台进行传播.所以呢,基本上每个基于微信开发的 H5 都会集成微信分享功能.但是,前几天在对接微信分享 API ...
- 学习笔记-vue hash模式打包
1.打包设置config->index.js 2.图片资源路径出现问题 设置下utils.js文件
- 通过修改 Apache 的配置文件 htaccess 文件实现自定义404页面
最近在学习使用Apache服务器的配置,做一个记录. Apache下有个.htaccess文件,是Apache的一个特殊的配置文件.这个配置文件默认是没有的,要手动在各自的项目的根目录编写才行. 要实 ...
- 066——VUE中vue-router之rewrite模式下配置404页面
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue开发多页面应用 - hash模式和history模式
我们知道vue可以快速开发web单页应用,而且官方为我们提供了自己的应用脚手架vue-cli,我们只需要下载脚手架,安装依赖后就可以启动vue应用雏形. 这得益与webpack的依赖追踪,各种资源后缀 ...
- Vue 编程式导航(通过js跳转页面)以及路由hash模式和history模式
第一种方法: this.$router.push({path:'shopcontent?aid=3'} 第二种方法 this.$router.push({name:'news'}} 通过在ma ...
- Vue路由的hash模式与history模式的区别?
1.首先router有两种模式:hash模式(默认).history模式(需配置mode: 'history') hash和history的区别? hash ...
- Vue中hash模式和history模式的区别
vue-router 中hash模式和history模式. 在vue的路由配置中有mode选项,最直观的区别就是在hash模式下的地址栏里的URL夹杂着‘#’号 ,而history模式下没有.vue默 ...
随机推荐
- java笔记之IO1
File:文件和目录(文件夹)路径名的抽象表示形式 * 构造方法: * File(String pathname):根据一个路径得到File对象 * File(String parent, S ...
- Phoenix数据覆盖的一种解决方案
最近在做实时数仓,需要兼顾离线和实时两种查询方式,大致的方案是数据通过binlog抽取,经Phoenix插入,hive映射hbase表:Phoenix创建索引,实时查询Phoenix:离线查询hive ...
- ODBC数据管理器 SqlServer实时数据同步到MySql
---安装安装mysqlconnector http://www.mysql.com/products/connector/ /* 配置mysqlconnector ODBC数据管理器->系统D ...
- float(double)快速转换int的方法
自己写一个软件渲染器的时候,无意中发现float转换int非常耗时,于是查阅文章,这才有了这个命题,以前不清楚还有这么个机制.网上看了很多文章,搜索到了一个数字6755399441055744,这个是 ...
- 使用Docker Compose编排微服务
一般微服务架构会包含若干个微服务,而每个微服务可以有多个实例,如果每个微服务都有手动启停,那么效率就很低.维护量比较大. 所以我们可以使用Docker Compose来轻松.高效地管理容器. 一.安装 ...
- ls -l 详解
ls -l 是文件系统的一个命令,用来查询当前路径的文件的属性.大小等详细信息
- python ftp小程序练习
作业要求: 开发一个支持多用户在线的FTP程序 要求: 1.用户加密认证 2.允许同时多用户登陆 3.每个用户都有自己的家目录,并且只能访问自己的家目录 4.对用户进行磁盘配额,每个用户的可用空间不同 ...
- hdu 1863 畅通工程(Kruskal+并查集)
畅通工程 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submi ...
- composer 加快更新速度
一.使用代理 set http_proxy=http://127.0.0.1:8087 //Windows export http_proxy=http://127.0.0.1:8087 //linu ...
- fastboot命令详解
Android手机分区(每个分区都有相应的img文件对应):开机启动画面区(splash1),数据恢复区(recovery),内核区(boot), 系统区(system),数据缓存区(cache),用 ...