javascript - Vue2 : view-router exception when trying to use <router-view>

标签 javascript html webpack vuejs2 vue-router

第一次尝试 Vue2,但我被路线困住了。

基本上,当我添加<router-view></router-view>时到index.html我开始收到异常:

[Vue warn]: Failed to mount component: template or render function not 
defined.

found in

---> <Anonymous>
       <Root>

GitHub 代码链接:https://github.com/kernelcurry/httpverbs-site/tree/c56ba0a45445f7d28c31cb6928471da3619a3327

我什至查阅了有关该主题的视频教程,他们似乎没有问题,但我有。 (视频链接:https://laracasts.com/series/learn-vue-2-step-by-step/episodes/26)

澄清一下,直到我添加 <router-view></router-view> 后,错误才发生。至index.html (线路链接:https://github.com/kernelcurry/httpverbs-site/blob/c56ba0a45445f7d28c31cb6928471da3619a3327/index.html#L10)

我希望我能更深入地了解这里发生的事情,但我不知所措。感谢任何愿意查看代码并为我指出正确方向的人:)

最佳答案

按如下方式更改 src/routes.js:

import VueRouter from 'vue-router';
import Home from './views/home.vue'
import About from './views/about.vue'

let routes = [
    {
        path: '/',
        component: Home
    },
    {
        path: '/about',
        component: About
    }
];

export default new VueRouter({
    routes
});

关于javascript - Vue2 : view-router exception when trying to use <router-view>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45975499/

相关文章:

javascript - 如何使用 webpack 将文件复制到分发文件夹?

javascript - 如何在多个文本上添加计数器

javascript - 响应式下拉导航问题

vue.js - 如何在 Vue.js 中排除文件(例如配置文件)?

html - li 元素填充 ul 宽度,水平菜单中元素之间的间距相同

html - 背景视频未集中在 Bootstrap 单元中

javascript - Webpack - 如何 bundle/要求文件夹(子文件夹)的所有文件

javascript - 跨浏览器支持 jQuery

c# - 如何使用 @Html.TextBoxFor 的用户输入设置 @Html.RadioButtonFor 的值?

javascript - 在文本框上传递值