我尝试在其他组件(App.vue)中使用 vue 组件(Global.vue),但是有
无法挂载组件:未定义模板或渲染函数
错误.
Global.vue:
<div class="global-view"><p>全局</p></模板><脚本>导出默认{名称:'全球'}
App.vue:
<div id="应用程序"><全球></全球><路由器视图></路由器视图></模板><脚本>导出默认{名称:'应用'}
main.js:
从'vue'导入Vue从'./App'导入应用程序从'./router'导入路由器Vueponent('global', require('./components/Global'))Vue.config.productionTip = false新的 Vue({el: '#app',路由器,模板:'<App/>',组件:{应用}}) 解决方案您需要在要在其中使用它的组件文件中导入该组件.
`从'./components/Global'导入全局
从那里你需要在你的组件选项中添加一个新的键来注册"组件.
这是您希望应用组件的外观.
<div id="应用程序"><全球></全球><路由器视图></路由器视图></模板><脚本>从 './components/Global 导入全局导出默认{名称:'应用'成分: {'全球':全球,}}
<global></global> 此时应该能够渲染.
I tried to use a vue component(Global.vue) in other component(App.vue), but there
Failed to mount component: template or render function not defined
error.
Global.vue:
<template> <div class="global-view"> <p>Global </p> </div> </template> <script> export default { name: 'global' } </script>App.vue:
<template> <div id="app"> <global></global> <router-view></router-view> </div> </template> <script> export default { name: 'app' } </script>main.js:
import Vue from 'vue' import App from './App' import router from './router' Vueponent('global', require('./components/Global')) Vue.config.productionTip = false new Vue({ el: '#app', router, template: '<App/>', components: { App } })解决方案
You need to import the component within the component file that you want to use it in.
`import Global from './components/Global'
From there you need to add a new key inside your components option that will "register" the component.
Here is what you want your app component to look like.
<template> <div id="app"> <global></global> <router-view></router-view> </div> </template> <script> import Global from './components/Global export default { name: 'app' components: { 'global': Global, } } </script><global></global> should be able to render at this point.
更多推荐
在其他 vue 组件文件中使用 vue 组件
发布评论