微信小程序-父子组件间通信

1.父子组件之间通信的三种方式

1.1属性绑定：父—>子

在子组件中的properties中先提前定义好父组件传递过来的数据，

 properties: {
    count:{
      type:Number,
      value:0
    }
  }
  
  注意：properties中的数据与data中的数据是一致的，直接可以被修改

在父组件中通过子组件标签以属性的方式传递数据给子组件

<son-comp count="{{count}}"></son-comp>

属性绑定（只能传递一些基础的数据，不能传递复杂数据如：函数）

1.2事件绑定：子—>父

步骤1：
	在父组件js文件中定义一个函数，这个函数通过自定义事件的形式传递给子组件
步骤2：
	在父组件的wxml中，通过自定义事件的形式，将步骤1中定义的函数引用，传递给子组件

	自定义事件：通过bind来实现
		 <标签 bind:自定义事件名称="步骤1中定义好的函数"></标签>
			或者
		 <标签 bind自定义事件名称="步骤1中定义好的函数"></标签>
步骤3：
	在子组件中通过this.triggerEvent("父组件传递过来的自定义事件名称",{携带参数}) =》来调用父组件传递过来的自定义事件
	
步骤4：
	在父组件自定义事件函数中通过event事件对象.detail 来获取参数

1.3获取组件实例：

获取组件实例:在父组件直接使用子组件中的数据和方法

 // 在父组件内部调用selectComponent(“子组件的class选择器或者id选择器”)
  getSonData(){
    // 在父组件中获取子组件实例对象
    const sonCompObj=this.selectComponent(".son")
    console.log(sonCompObj);
    // 使用子组件实例修改子组件内部属性
    /* sonCompObj.setData({
      "number":sonCompObj.data.number+10
    }) */
    // 使用子组件实例调用子组件内部方法
    sonCompObj.addNum()
  },
  	
  给子组件提供一个类选择器或者id选择器
   <son-comp class="son" bind:getSonComNumData="getSonComNumData" count="{{count}}"></son-comp>