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

 

posted @ 2016-07-18 11:43  xianglongxiang  阅读(129)  评论(0编辑  收藏  举报