Vue-router: 在微信浏览器中都可以打开,在华为,在oppor9s和华为系列机器打开空白页.

Created on 8 Jun 2017  ·  8Comments  ·  Source: vuejs/vue-router

Version

2.2.1

Reproduction link

http://znwx.hdme999.com/#/Home/information/stock_infos

Steps to reproduce

vue-router用的是2.0.0,在微信内置浏览器都可以打开,在ios自带浏览器中也可以打开,但是在华为系列和oppo系列的都无法打开.浏览器中打开是空白页

What is expected?

不再是空白页

What is actually happening?

正常打开

need repro

Most helpful comment

I've solved this problem, and that's the ES6 problem.

You can refer to a blog: http://blog.csdn.net/xtaydwxf1988/article/details/68064094.

I hope I can help some people
@posva

All 8 comments

We need more details to be able to do anything, like the user agent (should contain all relevant information). Are you saying that the basic example: http://jsfiddle.net/posva/9r6xhqbp/ doesn't even work? or the same thing in an html file? If the example is more complex, we need an actual repro
Also, please make sure you are not using history mode in an old browser with no support for it.

const router = new VueRouter({
routes: [{
path: '/Home', component: require('../src/components/home/Home.vue'),
// 子路由
children: [
{
path: '/Home/information', component: require('../src/components/information/information.vue'),
name: 'information',
redirect: 'strategy_infos',
children: [
{
path: '/Home/information/stock_infos',
name: 'stock_infos',
component: require('../src/components/information/children/stock_infos/stock_infos.vue')
},
{
path: '/Home/information/strategy_infos',
name: 'strategy_infos',
component: require('../src/components/information/children/strategy_infos/strategy_infos.vue')
},
{
path: '/Home/information/fundLikes/:id',
name: 'fundLikes',
component: require('../src/components/information/children/fundLikes/fundLikes.vue')
},
]
},
{
path: '/Home/my',
name: 'my',
component: require('../src/components/my/my.vue')
}
]
}, {
path: '/addChannel',
name: 'addChannel',
component: require('../src/components/addChannel/addChannel.vue')
},
{
// 股市直播详细
path: '/stock_comments/:id',
name: 'stock_comments',
component: require('../src/components/stock_comments/stock_comments.vue')
}, {
// 策略详细
path: '/strategy_detInfos/:id',
name: 'strategy_detInfos',
component: require('../src/components/strategy_detInfos/strategy_detInfos.vue')
}, {
// 类基金详细(多个)
path: '/fundLikes_dets/:id',
name: 'fundLikes_dets',
component: require('../src/components/fundLikes_dets/fundLikes_dets.vue')
}, {
// 我的订阅
path: '/my_subscribe',
name: 'my_subscribe',
component: require('../src/components/my_subscribe/my_subscribe.vue')
}, {
// 关于我
path: '/my_about',
name: 'my_about',
component: require('../src/components/my_about/my_about.vue')
}, {
// 默认路由
path: '*',
redirect: '/Home/information/strategy_infos'
}

],
linkActiveClass: 'active'
});
// 输出router
export default router;

这是我的路由配置,是hash模式下面.
http://znwx.hdme999.com/#/Home/information/stock_infos 这是我的项目地址.可以在pc和微信浏览器and safari中打开.
@posva

You're still not answering my questions... Also, please note that, as much I'd like to, I don't speak Chinese

I've solved this problem, and that's the ES6 problem.

You can refer to a blog: http://blog.csdn.net/xtaydwxf1988/article/details/68064094.

I hope I can help some people
@posva

because pull in the axios,it's base on es6 Promise,so can't use under Android 4.4。I'm use this fix it.

babel-runtime/core-js/promise

@Zenser 用babel-runtime/core-js/promise怎么实现的使用

@AutumnDeSea你好,我按照你博客的方法写,华为自带浏览器还是白屏,babel-profill也安装了

For anyone running into this issue in 2019 - add the "babel-polyfill" package and import it in your main.js file. This should fix the issue.

Was this page helpful?
0 / 5 - 0 ratings