我在一个组件中引入的vue-router
import Router from 'vue-router'
let router = new Router()
然后在一个点击事件中使用push()
方法跳转到一个页面,
router.push('/gaming')
可以成功跳转,但是当我连续跳转->返回
两次后,浏览器便提示我找不到页面,浏览器地址栏就会清空。
我尝试去监测history,
首先进入首页的时候长度是2;
第一次跳转后,一直到最后一次返回出现找不到页面长度一直都是3;
在找不到页面的情况下,我在浏览器控制台打印history,长度依旧是3.
补充路由代码:
export default new Router({
linkActiveClass: 'active',
// mode:'history',
routes: [
{
path: '/wechat',
name: 'wechat',
component: wechat,
children: [
{
path: 'index',
component: wechat_index,
children: [
{
path: '/',
component: wechat_hot,
redirect: 'hot'
},
{
path: 'hot',
component: wechat_hot
},
{
path: 'tabCon1',
component: wechat_tabCon1,
children:[
{
path:'/',
component:wechat_tabCon1_itm2,
redirect:'item2'
},
{
path:'item1',
component:wechat_tabCon1_itm1,
name:'item1'
},
{
path:'item2',
component:wechat_tabCon1_itm2,
name:'item2'
},
{
path:'item3',
component:wechat_tabCon1_itm3,
name:'item3'
},
{
path:'item4',
component:wechat_tabCon1_itm4,
name:'item4'
}
]
},
{
path: 'tabCon2',
component: wechat_tabCon2
},
{
path: 'tabCon3',
component: wechat_tabCon3
},
{
path: 'tabCon4',
component: wechat_tabCon4
}
]
},
{
path: 'publish',
name: 'publish',
component: wechat_publish
},
{
path: 'chat',
name: 'chat',
component: wechat_chat
},
{
path: 'personal',
name: 'personal',
component: wechat_personal
},
{
path: 'article',
name: 'article',
component: wechat_article
},
]
},
{
path: '/store',
name: 'store',
component: store,
children: [
{
path: 'goods',
name: 'goods',
component: store_goods
},
{
path:'details',
component:store_details
}
]
},
{
path: '/share',
name: 'share',
component: share,
children: [
{
path: 'detail_video',
component: detail_video,
name: 'detail_video'
},
{
path: 'detail_video_s',
component: detail_video_s,
name: 'detail_video_s'
},
{
path: 'detail_goods',
component: detail_goods,
name: 'detail_goods'
},
{
path: 'detail_article',
component: detail_article,
name: 'detail_article'
},
]
},
{
path:'/details',
component:details,
},
{
path: '*',
component: wechat_index,
name: 'index',
rediect: '/wechat/index'
}
]
})
main.js中:
import router from './router'
...
new Vue({
el: '#app',
router,
store,
// api,
// WX,
template: '<App/>',
components: { App }
})
组件中:
import Router from 'vue-router'
const router = new Router()
// methods
showDetails: function (data) {
router.push('/details?id=' + data._id + '&type=' + data.type + '&lon=' + data.lon + '&lat=' + data.lat)
}
能想到有关联的就是这些了,还有什么需要的请提醒我补充。