Vue.js 在vue中找不到组件时如何显示存根组件

我试图了解组件未找到时的情况，即：

{
模板：“”
}

此时，Vue用

未知自定义元素警告我们：…

我想在未找到某个未知组件时介入，然后使用另一个组件，如

存根组件

：

{
名称：'存根组件'，
道具：['componentName']，
模板：“组件${componentName}不存在，请单击此处创建…
”
}

---

更新：我正在寻找不更改模板本身的解决方案，因此没有添加

v-if

和

组件

。

Vue将所有注册组件的详细信息存储在Vue实例的

$options.component

属性中

因此，您可以使用

this.$options.component

检查组件的可用性，如果组件存在，则加载该组件，否则加载其他组件

在下面的示例中，假设您有两个不同的组件，并且希望在可用性上加载它们，那么您可以在此基础上创建一个计算属性，根据需要加载该组件

var CustomComponent=Vue.extend（{template:'A custom Component'}）；
var AnotherComponent=Vue.extend（{template:'自定义组件不存在'。}）；
新Vue({
el:“应用程序”，
组成部分：{
自定义组件，
另一种成分
},
计算：{
组件可用（）{
返回此项。$options.components.CustomComponent
}
}
})

---

Vue会公开全局错误和警告处理程序。我通过使用全局warnHandler获得了一个有效的解决方案。我不知道这是否正是你想要的，但这可能是一个很好的起点。请参阅工作片段（我认为这是不言自明的）

Vue.config.warnHandler=函数（错误、虚拟机、信息）{
if（错误包括（“未知自定义元素：”）{
让componentName=err.match（//g）[0]。切片（1，-1）
vm.$options.components[componentName]=Vue.component（'stub-component'{
道具：['componentName']，
模板：`组件“${componentName}”不存在，请单击此处创建…
`，
});
vm.$forceUpdate（）
}否则{
控制台。警告（错误）
}
};
新Vue({
el:“#应用程序”，
})

除非有人抢先一步，否则我正试图想出一个答案。我不知道有什么直截了当的方法。不过，我有一个问题。在哪种情况下，您会有一个不存在的自定义元素标记，而该标记无法在您的代码中修复？我有自己的ide，我希望在其中编写代码并稍后创建组件。另外，我想定制组件的搜索和加载方式（某种网页替代方案），谢谢你的回答。但问题不同。我不想在

v-if

等中进行任何包装。我只想在模板中使用自定义组件，然后“以某种方式”找到正确的组件或传递存根组件。完美。它似乎工作得很好，很容易添加/删除。哦，非常感谢！