web-dev-qa-db-fra.com

Erreur vue-routeur: TypeError: Impossible de lire la propriété «correspondante» de non définie

J'essaie d'écrire ma première application Vuejs. J'utilise vue-cli et passe-partout simple-webpack .

Lorsque j'ajoute vue-router liens vers mon composant d'application, j'obtiens cette erreur dans la console

Erreur dans la fonction de rendu: "TypeError: Impossible de lire la propriété" correspondante "de non définie"

Voici mon code:

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.js 

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.js 

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});
javascriptvue.jsvuejs2vue-router
16
Mohammad Reza

Le nom lorsque vous l'ajoutez à Vue must be router.

import router from './routes.js'

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

Si, pour une raison quelconque, vous souhaitez appeler la variable routes, vous pouvez l'affecter de cette façon.

import routes from './routes.js'

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

Sur mon fichier Vue, j'avais le code suivant:

Ensuite, j'ai modifié mon fichier app.js et placé le code suivant:

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

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

vue & vue router & match bug & solution

match bugs

image

image

solution

le nom doit être router

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

image

D'accord

image

image

importer le bogue du module par défaut

import module par défaut pas besoin {}!

1
xgqfrms