Vue学习笔记

vue 局部注册的调用

在官方文档是这样描述的：不需要全局注册每个组件。可以让组件只能用在其它组件内，用实例选项 components 注册

var Child = Vue.extend({ /* ... */ })

var Parent = Vue.extend({
  template: '...',
  components: {
    // <my-component> 只能用在父组件模板内
    'my-component': Child
  }
})

那么问题来了，小伙伴如何调用，请看下面示例：

   var Child = Vue.extend({
            template: "Child boy"
        })
        var Parent = Vue.extend({
            template: 'This is Parent and has <my-component></my-component>',
            components: {
                // <my-component> 只能用在父组件模板内
                'my-component': Child
            }
        })
        Vue.component('p-component', Parent);

页面调用：

  <p-component></p-component>

结果：This is Parent and has Child boy