Vue-router 오류:TypeError: 정의되지 않은 속성 'matched'를 읽을 수 없습니다.

Vue-router 오류:TypeError: 정의되지 않은 속성 'matched'를 읽을 수 없습니다.

나는 나의 첫 Vuejs 앱을 만들려고 한다.사용하고 있다vue-cli심플한 웹팩 보일러 플레이트.

추가할 때vue-router앱 구성 요소에 대한 링크 콘솔에서 이 오류가 발생합니다.

렌더 함수 오류: "TypeError: 정의되지 않은 속성 'matched'를 읽을 수 없습니다."

코드는 다음과 같습니다.

App.vue

<template>
  <div>
    <h2>Links</h2>
    <ul>
      <router-link to='/'>Home</router-link>
      <router-link to='/query'>Query</router-link>

      <router-view></router-view>
    </ul>
  </div>
</template>

<script>
    export default {}
</script>

main.discloss.main.discloss.

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)
import routes from './routes.js'
import App from './App.vue'

const app = new Vue({
  el: '#app',
  routes,
  render: h => h(App)
})

routes.displaces

import VueRouter from 'vue-router';
let routes=[
  {
    path: '/',
    component: require('./Components/Home.vue')
  },
  {
    path: '/query',
    component: require('./Components/Query.vue')
  }
];

export default new VueRouter({routes});

Vue에 추가할 때 이름은 다음과 같아야 합니다.router.

import router from './routes.js'

const app = new Vue({
  el: '#app',
  router,
  render: h => h(App)
})

어떤 이유로든 변수를 호출하고 싶은 경우routes이렇게 할당할 수 있습니다.

import routes from './routes.js'

const app = new Vue({
  el: '#app',
  router: routes,
  render: h => h(App)
})

vue 및 vue 라우터 및 일치 버그 및 솔루션

일치 버그

해결 방법

이름은 다음과 같아야 합니다.router

https://stackoverflow.com/a/44618867/5934465

네 알겠습니다

---

Import 디폴트모듈 버그

import디폴트 모듈 불필요{}!

Vue 파일에는 다음 코드가 있습니다.

그런 다음 app.js 파일을 수정하고 다음 코드를 입력했습니다.

import router from './Router/router.js'

const app = new Vue({
    el: '#app',
    router
});

여기에 루트를 Import하지 않고 같은 페이지에 배치하는 경우에는 Vue 컴포넌트 렌더 전에 루트를 선언해야 합니다.

다음과 같이:-

const router = new VueRouter({
  mode: 'history',
  routes:[
    { path: '/dashboard', component: Dashboard},
    { path: '/signin', component: Signin}
  ]
});

new Vue({
  el: '#app',
  router,
  render: h => h(App)
})

이렇게는 안 돼:

new Vue({
  el: '#app',
  router,
  render: h => h(App)
})

const router = new VueRouter({
  mode: 'history',
  routes:[
    { path: '/dashboard', component: Dashboard},
    { path: '/signin', component: Signin}
  ]
});

제 오타를 추가해서 말씀드리자면요.Import의 {}을(를) 잊어버렸습니다.

import { router } from './routes.js'  //correct
import router from './routes.js'   //causes same error

router/index.js에 커스터마이즈된 코드를 삽입한 경우에도 마지막에 디폴트라우터를 내보냅니다.

const router = new Router({
  mode: 'history'
});
export default router;

저도 당신과 같은 문제에 직면해 있습니다.그 후 index.js의 마지막에 다음과 같이 추가하는 것을 잊었습니다.

export default router

그럼 내 경우엔 문제가 해결되겠군

언급URL : https://stackoverflow.com/questions/44618761/vue-router-error-typeerror-cannot-read-property-matched-of-undefined