Vue中怎么动态创建注册component-创新互联
这期内容当中小编将会给大家带来有关Vue中怎么动态创建注册component，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。
创新互联于2013年成立，是专业互联网技术服务公司，拥有项目
成都网站制作、网站设计网站策划，项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命，1280元红河哈尼做网站,已为上家服务,为红河哈尼各地企业和个人服务,联系电话:18982081108
常规组件声明与注册
// 定义一个名为 button-counter 全局注册的组件
Vue.component("button-counter", {
template: 'You clicked me {{ count }} times.',
data() {
return {
count: 0
}
}
});
new Vue({
template: `
App Component
`
}).$mount("#app");
在上面的代码中我们声明了一个叫做 button-counter 的组件。如果在常规情况下使用的话，只需要在页面上写对应的 标签就够了。
全局创建注册组件可以实现动态创建，但是我们必须在 template 声明使用该组件，而且如果把所有组件都全局注册这并不是一个好办法。
在官方文档中我们可以看到，我们可以通过 Vue.component('component-name') 的方式来注册一个组件。
而组件实例又有 $mount 这样一个方法，官方对于 $mount 的解释如下：
vm.$mount( [elementOrSelector] )
Arguments:
{Element | string} [elementOrSelector]
{boolean} [hydrating]
Returns: vm - the instance itself
Usage:
If a Vue instance didn't receive the el option at instantiation, it will be in “unmounted” state, without an associated DOM element. vm.$mount() can be used to manually start the mounting of an unmounted Vue instance.
If elementOrSelector argument is not provided, the template will be rendered as an off-document element, and you will have to use native DOM API to insert it into the document yourself.
The method returns the instance itself so you can chain other instance methods after it.
那我们是否可以通过这种方式来达到我们的需求呢？
还不够！
为什么？？？
因为 Vue.component 返回的结果是一个 function！它返回的并不是 组件实例，而是一个构造函数。
那到这里其实我们就清楚了。 对于 Vue.component 声明的组件，我们先通过 Vue.component 获取它的构造函数，再 new 出一个组件实例，最后 通过 $mount 挂载到 html 上。
// 定义一个名为 button-counter 全局注册的组件
Vue.component("button-counter", {
template: 'You clicked me {{ count }} times.',
data() {
return {
count: 0
}
}
});
new Vue({
template: `
App Component
click to insert button-counter comonent
