路由器视图未加载内容，无法安装模板
Posted
技术标签:
【中文标题】路由器视图未加载内容，无法安装模板【英文标题】：Router-view not loading contents, failed to mount template 【发布时间】：2020-07-29 05:15:55 【问题描述】：我是 Laravel 和 Vue Js 的新手。我遇到了一个问题，我无法弄清楚确切的问题是什么。
app.blade.php
<body>
<v-app id="app">
<example-component/>
</v-app>
<script src=" asset('js/app.js') "></script>
</body>
app.js
/**
* First we will load all of this project's javascript dependencies which
* includes Vue and other libraries. It is a great starting point when
* building robust, powerful web applications using Vue and Laravel.
*/
require('./bootstrap');
window.Vue = require('vue');
import vuetify from './vuetify';
import router from './router';
import Example from './components/ExampleComponent';
new Vue(
el: '#app',
router,
vuetify
);
ExampleComponent.vue
<template>
<div>
<v-content>
<v-container>
<v-btn color="primary" link to="/foo">Foo</v-btn>
<v-btn color="primary" link to="/bar">Bar</v-btn>
</v-container>
<router-view></router-view>
</v-content>
</div>
</template>
<script>
export default
</script>
<style>
</style>
vuetify.js
import Vue from 'vue';
import Vuetify from 'vuetify';
Vue.use(Vuetify)
export default new Vuetify(
)
路由器.js
import Vue from 'vue';
import VueRouter from 'vue-router';
const foo = templates: '<v-alert type="success">I am Foo</v-alert>'
const bar = templates: '<v-alert type="success">I am Bar</v-alert>'
Vue.use(VueRouter)
const routes = [
path: '/foo',
component: foo,
,
path: '/bar',
component: bar,
]
export default new VueRouter(
routes
)
它在控制台中给了我这个错误：
app.js:23169 [Vue warn]: Failed to mount component: template or render function not defined.
found in
---> <Anonymous>
<VContent>
<ExampleComponent> at resources/js/components/ExampleComponent.vue
<VApp>
<Root>
我的按钮没有加载路由器视图。另外，我想知道使用 import 和 Vue.component 注册组件有什么区别？请帮帮我。
【问题讨论】：
【参考方案1】：好像有错别字。变化：
const foo = templates: '<v-alert type="success">I am Foo</v-alert>'
const bar = templates: '<v-alert type="success">I am Bar</v-alert>'
到
const foo = template: '<v-alert type="success">I am Foo</v-alert>'
const bar = template: '<v-alert type="success">I am Bar</v-alert>'
【讨论】：
以上是关于路由器视图未加载内容，无法安装模板的主要内容，如果未能解决你的问题，请参考以下文章
控制器已在 DOM 中加载，但视图未加载且无法找到控制器 - oclazyload with jam(pugjs)