| Vue组件错误：＜xxx＞ | 您所在的位置：网站首页 › su的escape插件出错 › Vue组件错误：＜xxx＞ |
Vue组件错误：＜xxx＞
|
1.出现的错误
今天在试验vue中父子组件的通信时出现了下面这个报错：
大概意思就是组件是否正确注册 但是楼主是注册了组件的，这就让人很迷惑： const vm = new Vue({ el:'#root', components:{ app, child1, child2 } })随后楼主又去查看源代码，发现了一个细节： // 父组件 const app ={ name:"app", template:` `, data() { return { message:"Message from app", } }, methods: { parentFn(message){ this.getMessage=message; } }, }没错，我的子组件是直接嵌入到父组件的template配置项中的，而局部注册就会导致配置项中的子组件是无法识别的，所以控制台会报组件未定义的错误 2.解决方案所以现在要解决的问题就是如何让父组件的template配置项能够识别到子组件 楼主首先考虑到的是JS的执行机制，即JS在执行是从上到下逐行执行的，所以楼主简单地将父组件放到了所有子组件的下方，然而并没有什么用(doge) 随后考虑到“局部注册”这个概念，是不是因为局部注册导致的全文无法识别到呢？于是楼主改用了全局注册组件: // 全局注册 Vue.component("app",app); Vue.component("child1",child1); Vue.component("child2",child2);果然成功运行了而且控制台也没有报错：
在组件递归中（即直接在template里面嵌套子组件），不能使用局部注册组件，这样会导致父组件在template配置项中无法识别该子组件，改用全局方法Vue.component("xxx",xxx)来注册组件 |
【本文地址】
公司简介
联系我们