Vue中输入无效的网址后并重定向后，主界面menu菜单无法展开

[suncs2001]

主界面左侧导航栏，点击menu，menu下有3个子菜单，正常情况下会向下弹出，显示3个子菜单。
但是如果浏览器输入过无效的网址，比如“localhost:8080”（后面没有"/"什么的），那么由于我设置了重定向，所以会重定向到login（http://localhost:8080/#/login），在login里 点击按钮，通过this.$router.push({path: '/main'})， 进入到主界面，问题是在这种情况下，点击menu则不会向下弹，没反应了。

而且在出现问题后，感觉浏览器进入了什么异常状态，再次输入http://localhost:8080/#/login能显示login界面，点击按钮仍然能跳转到主界面，但是menu不展开，此时如果重新刷新一下主界面（http://localhost:8080/#/main）则menu能正常展开了。

如果启动浏览器后，不输入无效的网址，直接输入主界面，则没问题。

不知道哪里出了问题，怀疑是跟输入的不完全网址有关系，导致浏览器处于什么状态了。不知道怎么定位

[NANU-NANA]

难道没有任何错误信息么？

[suncs2001]

没有异常，反正F12里 console里看不出异常。 我感觉好像是vue的路由啥地方有问题，特别是输入的网址如果不在路由表中的时候，是不是会导致界面无法响应什么

[suncs2001]

仔细看了下，确实有异常，因为以前没搞过web，有些东西不知道。今天发现可以用chrome单布调试，里面有个出现异常时断住的功能，打开这个功能确实能断住异常，应该是在vue内部出现异常了。经过反复对比，有这个异常就不能弹出菜单，没有这个异常就可以正常弹出，所以应该是跟这个异常有关。
这个异常出现在vue-router.esm.js中，会进入onAbort(err);这一行

History.prototype.transitionTo = function transitionTo (
  location,
  onComplete,
  onAbort
) {
    var this$1 = this;

  var route = this.router.match(location, this.current);
  this.confirmTransition(
    route,
    function () {
      this$1.updateRoute(route);
      onComplete && onComplete(route);
      this$1.ensureURL();

      // fire ready cbs once
      if (!this$1.ready) {
        this$1.ready = true;
        this$1.readyCbs.forEach(function (cb) {
          cb(route);
        });
      }
    },
    function (err) {
      if (onAbort) {
        onAbort(err);
      }
      if (err && !this$1.ready) {
        this$1.ready = true;
        this$1.readyErrorCbs.forEach(function (cb) {
          cb(err);
        });
      }
    }
  );
};

在出现异常的时候，看this.current 是undefine的，正常应该不是undefine才对。为什么会进入这一行还不清楚原因，正在分析中。

[jio可]

路由里面没有配置/路由吧

[NANU-NANA]

多用断点和console查看。 如果问题已解决，就结帖吧。

[suncs2001]

问题没解决，因为后面没有在Vue下使用bootstrap了，改成elementUI了，所以问题也不存在了。
问题应该是vue与jquery的冲突问题，毕竟两个算是同级别的东西同时存在于一个项目中。 这种坑对于我们前端能力薄弱的部门来说不能踩下去，即使这个问题解决了后面不知道还有多少坑，所以后面果断换了。
可能有的bootstrap项目专门做过Vue的适配，会好些吧。还是感谢所有回复的同学。

[console.log( )]

引用 6 楼 suncs2001 的回复:

问题没解决，因为后面没有在Vue下使用bootstrap了，改成elementUI了，所以问题也不存在了。 问题应该是vue与jquery的冲突问题，毕竟两个算是同级别的东西同时存在于一个项目中。 这种坑对于我们前端能力薄弱的部门来说不能踩下去，即使这个问题解决了后面不知道还有多少坑，所以后面果断换了。 可能有的bootstrap项目专门做过Vue的适配，会好些吧。还是感谢所有回复的同学。

在vue一般不用jquery 不推荐 但确实是能用 你的问题可能跟生命周期有关 ，jquery代码在Mounted周期内进行，此时vue已经渲染完毕，jquery才可以找到对应的DOM，如果需要jquery更新DOM，则在Mounted周期内不被允许，需要通过Updated进行操作