一、组件间的数据传递
1.父组件获取子组件的数据
*子组件把自己的数据,发送到父级
*vm.$emit(事件名,数据);
*v-on: @
示例用法:当点击send按钮的时候,“111”变成“我是子组件的数据”
<Meta charset="UTF-8">
父级<a href="/tag/huoqu/" target="_blank" class="keywords">获取</a>子级的数据
2、子组件获取父组件的数据
在调用子组件:
子组件之内:
- <Meta charset="UTF-8">
自己<a href="/tag/huoqu/" target="_blank" class="keywords">获取</a>父级的数据
运行结果:
二、内容分发:
Vue.js提供了一种混合父组件内容与子组件自己模版的方式:slot,用来占一个位置
1、基本用法
<Meta charset="UTF-8">
slot保留原来的位置
运行结果:ul标签里面的内容没有被覆盖,如果不使用slot,ul标签里的内容将会被覆盖
2、slot的name属性
<Meta charset="UTF-8">
slot中name<a href="/tag/shuxing/" target="_blank" class="keywords">属性</a>的使用
运行结果: