父子组件通信

父组件传递到子组件

  <component-a @my-event="onComaMyEvent" number-to-do=5></component-a>

子组件里渲染

{{numberToDo}}

再在export default中添加props属性

props:['number-to-do'],

注意驼峰转换

子组件传递到父组件

<button @click="emitMyEvent">emit</button>

methods:{
		emitMyEvent () {
			this.$emit('my-event', this.hello);
		}
	}

父组件里

  <component-a @my-event="onComaMyEvent" number-to-do=5></component-a>
  onComaMyEvent (param) {
    console.log(param)
  }

插槽(父到子)

  <component-a @my-event="onComaMyEvent" number-to-do=5>
    <p slot="header"> my header</p>
    <p slot="footer"> my footer</p>
  </component-a>

子组件内

	<slot name="header"> no header</slot>
	<slot name="footer"> no footer</slot>