0

每当我在 components/App.vue 的模板中使用 ID 为 #app 的组件标签时,它都会返回以下错误:

// components/App.vue
<template>
  <div id="app">
    <img class="logo" src="./assets/logo.png">
    <hello></hello>
    <a v-link="{ path: '/home' }">Go to Foo</a>
    <a v-link="{ path: '/about' }">Go to Bar</a>
    <p>
      Welcome to your Vue.js app!
    </p>
    <router-view></router-view>
  </div>
</template>

错误

[vue-router] <router-view> can only be used inside a router-enabled app.

[vue-router] v-link can only be used inside a router-enabled app.

但是,如果在没有组件的情况下这样做,而只是具有组件 ID 的常规元素,则它可以正常工作。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>VueJS Starter</title>
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

反正有没有将路由器与Web组件一起使用?因为必须将它与元素 id 一起使用也不适用于 Chrome 中的 vue-devtools。

4

1 回答 1

1

确保在您的main.js文件中提供信息。

在那里您应该正确导入和使用路由器,如下所示:

import VueRouter from 'vue-router';
...
Vue.use(VueRouter);
于 2017-01-09T14:12:09.050 回答