vue2.0 路由模式mode="history"的作用
特别提醒:开启mode="history"模式,需要服务端的支持,因为出现“刷新页面报错404”的问题;
大家都知道,路由地址都是以"#"形式展示,但是有些时候,我们又希望路由地址中不出现"#",那怎么办呢?
vue给我们提供了一个属性mode="history";代码如下
const router = new Router({
mode: 'history', // 去掉路由地址的#
routes: [
{
path: '/', // 默认进入路由[写在第一个]
redirect: '/home' //重定向
},
{
path: '/login',
name: 'login',
component: LoginPage
},
{
path: '**', // 错误路由[写在最后一个]
redirect: '/home' //重定向
}
]
});
vue2.0 路由模式mode="history"的作用的更多相关文章
- vue2.0路由
现在用vue-cli搭建的环境里面vue-router是下载好的 vue2.0路由方式和以前也有些不同 没了了map和start方法 目录结构如上图 这里有三个文件,app.vue显示,main.js ...
- vue2.0路由写法、传参和嵌套
前置知识请戳这里 vue-routerCDN地址:https://unpkg.com/vue-router@3.0.1/dist/vue-router.js vue-router下载地址:https: ...
- vue2.0路由进阶
一.路由的模式 第一种用history方式实现,HTML5使用window.history.pushState()实现路由的切换而不刷新页面. 第二种使用hash值的方式来实现. vue2.0两种都可 ...
- vue2.0路由变化1
路由的步骤 1.定义组件 var Home={ template:'<h3>我是主页</h3>' }; var News={ template:'<h3>我是新闻& ...
- vue2.0路由-路由嵌套
vue一个重要的方面就是路由,下面是自己写的一个路由的例子: 1.引入依赖库就不必再说 2.创建组件 两种写法 第一种:间接 <template id="home"> ...
- vue切换路由模式{hash/history}
vue中常用的路由模式 hash(#):默认路由模式 histroy(/)切换路由模式 切换路由模式 export default new Router({ // 路由模式:hash(默认),hist ...
- vue2.0 路由学习笔记
昨天温故了一下vue2.0的路由 做个笔记简单记录一下! 1.首相和vue1.0一样 要使用vuejs的路由功能需要先引入vue-router.js 2.然后修改原有a标签处代码 这里以一个ul li ...
- vue2.0路由切换后页面滚动位置不变BUG
最近项目中遇到这样一个问题,vue切换路由,页面到顶端的滚动距离仍会保持不变. 方法一: 监听路由 // app.vue export default { watch:{ '$route':func ...
- vue2.0 路由知识一(路由的创建的全过程)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- solr6.5.0版本(Windows安装图解)
此教程为solr6.5.0安装,自己制作,希望可以帮到你们.
- swift手记-4
// // ViewController.swift // learn4 // // Created by myhaspl on 16/1/23. // Copyright (c) 2016年 myh ...
- startup alter.log spfile.ora
SQL> select * from v$version where rownum=1; BANNER --------------------------------------------- ...
- Bootstrap的js插件之按钮(button)
1)属性: data-loading-text="载入中..."--使button呈现载入状态: data-toggle="button"--使按钮可以切换状态 ...
- ajax_get/post_两级联动
使用ajax实现菜单联动 通常情况下,GET请求用于从服务器上获取数据,POST请求用于向服务器发送数据. 需求:选择第一个下拉框的值,根据第一个下拉框的值显示第二个下拉框的值 首先使用GET方式. ...
- 增加tomcat的缓存
起因是我做了一个批量压缩图片的功能,在服务器上跑这个功能的时候,发现服务器有警告.警告的内容大概如下. XX.... to the cache because there was insuffic ...
- java 网络编程学习笔记
1.IP地址 IP地址组成:网络号段+主机号段 IP地址分类: A类:第一号段为网络号段+后三段的主机号段 1.0.0.1---127.255.255.254(10.x.x.x是私有地址) 一个网络号 ...
- Springboot-添加对jsp支持
1,在项目的配置文件加入以下依赖 <dependency> <groupId>javax.servlet</groupId> <artifactId>j ...
- Android项目实战(三十五):多渠道打包
多渠道打包: 可以理解为:同时发布多个渠道的apk.分别上架不同的应用商店.这些apk带有各自渠道的标签,用于统计分析各个商店的下载次数等数据. 实现步骤 一.添加友盟渠道标签 添加位置:app目录下 ...
- git学习笔记5-撤销操作
git撤销有四种情况,一是没有commit,想恢复所有文件:二是没有commit,想恢复全部文件:三是已经commit了,想恢复某个版本:四是本地已经提交了,想从远程库恢复. 1. 没有commit, ...