vue组件的使用

props和$emit

//父组件

methods:{
  addFnc(data){
    //do something
  }
}
//子组件

methods:{
  addFnc(){
    this.$emit('add', data)  
  }
}

组件间通讯和自定义事件

父子通讯 props $emit
兄弟组件或者隔代组件使用自定义事件进行通讯

import Vue from 'vue'
export default new Vue()
//绑定自定义事件
event.$on('name', functionName)
//调用自定义事件
event.$emit('name',data)
//在beforeDestroy中销毁（解绑）自定义事件 以防内存泄露
event.$off('name', functionName)

组件生命周期

• 单个组件
• 父子组件
  由外到内