Vue.js基础(二)

1. 组件之间的通信

Vue.js基础(二)_第1张图片
父子组件之间的通信

向子组件中传递 number=99




子组件a.vue





执行效果

父组件向子组件传递number=99

2. 组件之间的通信 - 动态属性传递

表单里面的内容动态的显示在子组件中




子组件a.vue




组件之间的通信 - 动态属性传递
  • 插槽 slot
    向子组件传递一个模板

      

我是一个插槽

123456

com-a组件中


Vue.js基础(二)_第2张图片
插槽里面有内容
如果传递的插槽里面没有内容,为空

给插槽设置默认值

no slot

则显示


  • 具名Slot

com-a组件中


执行结果:


Vue.js基础(二)_第4张图片
具名插槽

3. 组件之间的通信 - 动态组件

# is

具体参考文档,没怎么讲!
https://cn.vuejs.org/v2/api/#is

你可能感兴趣的:(Vue.js基础(二))