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默 ...
随机推荐
- QT笔记-布局
1 QT中使用布局器QLayout布局 2自动计算各个空间的大小和位置 采用的既定policy策略来调整子窗口的大小和位置 3QHBoxLayout横向布局 QVBoxLayout纵向布局 QHBo ...
- 小程序各种授权封装、saveImageToPhotosAlbum、chooseAddress、getUserInfo、getLocation,保存图片、获取用户信息、获取位置信息、收货地址等
代码略多,请异步 github __点击链接
- Luogu P1137 旅行计划 【拓扑排序+Dp】By cellur925
题目传送门 由于满足游览先后顺序从西到东的性质,我们很自然的想到用拓扑排序处理出一个合理的游览顺序. 然鹅,之后呢? 事实上,拓扑排序常与Dp相结合,解决后效性.我们就可以在每次拓扑入队的时候更新答案 ...
- 【原创】《从0开始学Elasticsearch》—初识Elasticsearch
目录 1. Elasticsearch 是什么2. Elasticsearch 中基本概念3. Elasticsearch 安装4. 访问 Elasticsearch 1. Elasticsearch ...
- nginx https反向代理tomcat
Context体现在server.xml中的Host里的<Context>元素,它由Context接口定义.每个<Context>元素代表了运行在虚拟主机上的单个Web应用. ...
- Selenium定位多个iframe嵌套中的元素
在公司boss系统中,经常会遇到多层iframe嵌套的情况,导致无法定位最里面那层iframe的元素. 其实很简单,只要一层层定位iframe,定位到你想要的那层iframe即可: 如果操作完需要返回 ...
- 小心我“DIR”溢出你!
转自https://blog.csdn.net/wql19881207/article/details/6300760 https://blog.csdn.net/wql19881207/articl ...
- 构造 HDOJ 5414 CRB and String
题目传送门 题意:给两个字符串s,t,可以在s字符串任意位置后面插入字符c(与前面的不同),问是否能够将s转换为t字符串 构造:首先lens > lent 或者 s[1] != t[1] 一定是 ...
- Nginx反向代理node,实现让静态文件在同一域
Nginx反向代理node,实现让静态文件在同一域 原文https://github.com/zhuangZhou/Blog/issues/4 不管是Vue还是React,还是传统的网站,与node服 ...
- R in action读书笔记(6)-第七章:基本统计分析(中)
7.2 频数表和列联表 > library(vcd) > head(Arthritis) ID Treatment Sex Age Improved 1 57 Treated Male 2 ...