vue-处理重复跳转报错问题
作者:互联网
一、components
About.vue
<template>
<h2>我是About的内容</h2>
</template>
<script>
export default{
name:'About'
}
<script/>
Home.vue
<template>
<h2>我是Home的内容</h2>
</template>
<script>
export default{
name:'Home'
}
</script>
router
index.js
//该文件主要用于:创建路由器定制路由规则
import Vue from 'vue'
import VueRouter from 'vue-router'
import About from '../components/About'
import Home from '../components/Home'
//使用插件
Vue.use(VueRouter)
//第一步:将原始的push保存一份
const originPush=VueRouter.prototype.push
const originReplace=VueRouter.prototype.replace
//第二步:将VueRoute.prototype.push做增强
VueRouter.prototype.push=function(location,okCallback,errCallback){
//使用push 的人没有传递:成功的传递,失败的回调
if(okCallback===undefined && errCallback ===undefined){
ruturn originPush.call(this.localtion).catch((=>{}))
}else{
return originPush.call(this,location,okCallback,errCallback)
}
}
//第三步:将VueRouter.prototype.replace做增强
VueRoute.prototype.repllce=funtion(location,okCallback,errCaback){
//若使用push的人没有传递:成功的回调,失败的回调
if(okCallback===undefined && errCallback===undefined){
return originReplace.call(this,location).catch(()=>{})
}else{
return originReplace.call(this,location,okCallback,errCallback)
}
}
//创建路由器,并定制路由规则
const router=new VueRouter({
routes:[//该数组用于存放一组一组的路由规则
{
path:'/about',//路径
conponent:About//组件
},
{
path:'/home',//路径
componetns:Home//组件
}
]
})
//暴露路由
export default router
}
标签:About,vue,重复,okCallback,转报,VueRouter,push,Home,prototype 来源: https://www.cnblogs.com/zmh114712318/p/16440035.html