【Vue】路由配置：訪問根目錄死循環；

一、問題

1.1、環境
電腦環境：Windows 10；
開發工具：VScode；
JDK環境: Jdk1.8；

1.2、問題
【Vue】搭建項目是，進入首頁，報錯：

Error in beforeCreate hook: “RangeError: Maximum call stack size exceeded”

二、解答

從明面上看，是hook鉤子 創建之前的錯誤，範圍錯誤，執行了最大次數的調用鏈；

剛開始沒感覺出來，後來看到出錯的地方，才反應過來是死循環；
出錯的原因是：
原路由：

import Vue from "vue";
import Router from "vue-router";

Vue.use(Router);

export default new Router({
  routes: [
    {
      path: "/",
      name: "index",
      redirect: "/"
    },

    {
      path: "/demo1",
      name: "demo1",
      component: () => import("@/views/demo1")
    },
    {
      path: "/demo2",
      name: "demo2",
      component: () => import("@/views/demo2")
    }
  ]
});

修復後的路由：

import Vue from "vue";
import Router from "vue-router";

Vue.use(Router);

export default new Router({
  routes: [
    {
      path: "/",
      name: "index",
      redirect: ""
    },

    {
      path: "/demo1",
      name: "demo1",
      component: () => import("@/views/demo1")
    },
    {
      path: "/demo2",
      name: "demo2",
      component: () => import("@/views/demo2")
    }
  ]
});

看出是哪裏的區別了麼，就是：

      path: "/",
      name: "index",
      redirect: "/"

如果用戶訪問根目錄，那麼會被這個路由攔截，然後轉發給根目錄，然後就死循環了；直接把redirect的值從【/】改成空即可；

完畢~

三、總結

歡迎關注我的
CSDN博客： https://blog.csdn.net/River_Continent
微信公衆號：幕橋社區

知乎：張牧野， https://www.zhihu.com/people/zhang-mu-ye-37-76/activities
簡書： https://www.jianshu.com/u/02c0096cbfd3