webpack+vue-router+vue-cli的dev模式下，为啥window.location无效

Question

webpack+vue-router+vue-cli的dev模式下，为啥window.location无效

1. 以下Authorize.vu文件在authorize.html中有调用,程序希望在onLogin事件后，跳到loan_apply_info.html页面。但好像不管用啊。

2. 点击authorize.html中的登录按钮时，会调用以下代码中events下的’onLogin‘事件，日志也有打出来，确认是调用到了。浏览器也有reload动作（进度条动了一下），但始终还是在本页。

3. 如果在window.location = ... 前后加上console.log（window.location）输出日志，可以看到window.location没有变化，都是/authorize.html。

4. 以下代码试了window.location和window.open两种方式都无效。
   有问题的代码片断在下面：

Authorize.vue

export default {
  data () {
    return {
      LoanAuthPanelSetting: {
        title: '请登录',
        subtitle: '',
        intro: '',
        phone_no_label: '',
        phone_no_placeholder: '手机号',
        auth_code_label: '',
        auth_code_placeholder: '验证码',
        get_auth_code_btn_label: '获取验证码',
        login_btn_label: '登录',
        warn_label: '注意事项',
        warn_text: '注意事项内容'
      },
      phone_no: ''
    }
  },
  events: {
    //  登录页:获取验证码
    'onGetVerifyCode': function (phone_no) {
      console.log('[Authorize]:events:onGetVerifyCode():' + phone_no)
      // TODO: ajax-call...
    },
    //  登录页:登录
    'onLogin': function (auth_info) {
      console.log('[Authorize]:events:onLogin():' + auth_info)
      console.log(window.location)
      //  window.location = '/loan_apply_info.html'  ---- 【无效】
      window.open('/loan_apply_info.html', '_self')  ---- 【改成这句也无效】
    }
  },
  components: {
    LoanLoginPanel
  }
}

Answer 1

你是怎么解决的呀

Answer 2

用location.href = 'index.html'试试

Answer 3

首先直接回答这个问题：
检查vue-router是history模式还是hash模式，如果是hash模式需要注意'#/'的拼接（默认是hash模式）
分析：
刚开始我以为是vue-router对window.unload或者beforeunload等事件作了劫持，查看vue-router.esm.js源码并未发现对window.unload或者beforeunload事件的劫持，而且beforeunload事件会有浏览器默认弹窗，所以否定了这一猜想；
改用this.$router.push()能正常跳转，仔细对比2种方式的url发现了不同之处（低级错误），错误的url中没有加上'http://',也就是说在history模式下，如果window.location.replace('localhost:8080/login')不会正常跳转，而window.location.replace('http://localhost:8080/login')能正常跳转。
很多时候我们去查问题都容易忽略低级错误，希望能帮到遇到这种问题的同学。

Answer 4

请问楼主怎么解决的？我也遇见这个问题 我重定向外网地址 例如百度 跳转不了

Answer 5

楼主这个问题怎么解决的啊？我后来是把这个跳转也做成了一个router跳转