- this.$router:
表示全局路由器对象,项目中通过router路由参数注入路由之后,在任何一个页面都可以通过此方法获取到路由器对象,并调用其push(), go()等方法;
跳转到哪里,用router.push
- this.$route:
表示当前正在用于跳转的路由器对象,可以调用其name、path、query、params等方法;
1.hash,window.hashchange
url中带有#不是很美观,根据#后面跳转,不请求服务器
const router = new VueRouter({
routes,
})
首先需要改动的关键位置
vue.config.js的publicPath
axios的baseURL
route.js的base
nginx配置
2.history. pushstate、replacestate
有时刷新404,所以要设置404页面。
url
const router = new VueRouter({
routes,
mode:“history”
})
通过history api,我们丢掉了#,但是它也有个问题:不怕前进,不怕后退,就怕刷新,f5,(如果后端没有准备的话),因为刷新是实实在在地去请求服务器的。在hash模式下,前端路由修改的是#中的信息,⽽浏览器请求时不会将 # 后⾯的数据发送到后台,所以没有问题。但是在history下,你可以⾃由的修改path,当刷新时,如果服务器中没有相应的响应或者资源,则会刷新出来404页⾯。