子组件向父组件传递数据一般都是通过事件方法的形式

一、触发事件

自定义组件触发事件时，需要使用triggerEvent方法，指定事件名、detail对象和事件选项：

  1. <!-- 在自定义组件中 -->
  2. <button bindtap="onTap">点击这个按钮将触发“myevent”事件</button>
  3. Component({
  4.   properties: {},
  5.   methods: {
  6.     onTap: function(){
  7.       var myEventDetail = {} // detail对象，提供给事件监听函数
  8.       var myEventOption = {} // 触发事件的选项
  9.       this.triggerEvent('myevent', myEventDetail, myEventOption)
  10.     }
  11.   }
  12. })

触发事件的选项包括：

选项名 类型 是否必填 默认值 描述
bubbles Boolean 否 false 事件是否冒泡
composed Boolean 否 false 事件是否可以穿越组件边界，为false时，事件将只能在引用组件的节点树上触发，不进入其他任何组件内部
capturePhase Boolean 否 false 事件是否拥有捕获阶段

二、自定义组件的触发事件

  1. // components/Tabs/Tabs.js
  2. Component({
  3.   /**
  4.    * 可以从父组件获取到的数据
  5.    * 组件的属性列表
  6.    */
  7.   properties: {
  8.     arr:{
  9.       type: Array,
  10.       value: [],
  11.     }
  12.   },
  14.   /**
  15.    * 组件自身的固有属性
  16.    * 组件的初始数据
  17.    */
  18.   data: {
  19.   },
  21.   /**
  22.    * 组件的方法列表
  23.    */
  24.   methods: {
  25.     changeItemActive(data){
  26.       console.log(data);
  27.       const _index = data.currentTarget.dataset;
  28.       const {index} = data.currentTarget.dataset;
  29.       this.triggerEvent("reSetData",{index});
  30.       /*
  31.           1、触发事件的事件名称为 "reSetData"
  32.         2、传递的对象为{index}  =>  传递的只能是对象
  33.       */
  34.     }
  35.   }
  36. })

三、在父组件中添加触发事件

父组件的文件（此处是以wxml作为父组件使用）

  1. <tabs bindreSetData="reSetData"></tabs>
  2. <!--
  3.     reSetData 即是事件名称
  4. -->

父组件的js文件（此处是以wxml作为父组件使用）

  1.   data: {
  2.     tabs:[
  3.       {
  4.         id: 0,
  5.         name: "首页",
  6.         isActive: true,
  7.       },
  8.       {
  9.         id: 1,
  10.         name: "原创",
  11.         isActive: false,
  12.       },
  13.       {
  14.         id: 2,
  15.         name: "视频",
  16.         isActive: false,
  17.       },
  18.       {
  19.         id: 3,
  20.         name: "我的",
  21.         isActive: false,
  22.       }
  23.     ]
  24.   },
  25.   reSetData(data){
  26.     /* data即是子组件中传递过来的对象数据 */
  27.     var index = data.detail.index;
  28.     let {tabs} = this.data;
  29.     tabs.forEach((v,i) => i===index?v.isActive=true:v.isActive=false);
  30.     this.setData({
  31.       tabs
  32.     })
  33.   },

父组件向子组件传递数据后，如果子组件中修改了数据的值那么就需要再通过子组件向父组件传递参数的方式，将数据传递给父组件，否则父组件中的数据不会被修改