VueJS与组件标签不工作

问题描述：

每当我用它有我的组件里面的模板中#APP的ID的组件标签路由/ App.vue返回以下错误：VueJS与组件标签不工作

// 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>

是否有无线路由器与网络组件？因为必须在元素ID中使用它也不适用于Chrome中的vue-devtools。

我想你可能使用类似骨干或Ractive其中JS解析模板，然后插入呈现的内容成占位符。在最顶级的VueJS中，您使用元素ID来挂载整个应用程序。但是，其中的每个ROUTED组件都会插入路由器视图层次结构中的正确位置。你似乎试图做的是将你的应用程序安装在别的东西的模板中（或者也许Vue本身，我不确定），但这不是它的做法。在文档中建议另一个传递。 http://vuejs.org/guide/index.html –

这个问题与你如何设置你的应用程序有关。我们必须看到你的主要js文件，看看你是如何引导组件的。 – Smalbil

答

请务必在您的main.js文件中提供信息。

在那里，你应该正确导入和使用路由器，就像这样：

import VueRouter from 'vue-router'; 
... 
Vue.use(VueRouter);

VueJS与组件标签不工作

相关推荐