这是结合网上示例准备编写一带复选框的树形菜单，可以多选，动态加载下一级数据，

子组件wxml文件：

<view class=“container”>

  <view style=“padding:5rpx 0;”>

    <image wx:if=’{{ isBranch }}’ bindtap=‘toggle’ src="{{ open ? ‘/images/tree_show_less.png’ : ‘/images/tree_show_more.png’}}"  class=‘item-sImg’

    data-itemid=’{{ model.id }}’></image>

    <image wx:else src=’/images/tree_turning_right.png’  class=‘item-sImg’></image>

    <checkbox value="{{model.id}}" checked="{{model.checked}}"

                   class=‘checkbox checkbox-scale’/>

    <text bindtap=‘tapItem’ data-itemid=’{{ model.id }}’ data-value=’{{ model.text }}’>{{ model.text }}</text>

  </view>

  <view style=‘padding-left: 25rpx;’ wx:if=’{{ isBranch }}’ hidden=’{{ !open }}’>

    <mytree wx:for=’{{ model.nodes }}’ wx:key=‘id’ model=’{{ item }}’></mytree>

  </view>

</view>

子组件js文件：

Component({

  properties: {

    model: Object,

  },

  data: {

    open: true,

    isBranch: false,

  },

  methods: {

    toggle: function(e) {

      if (this.data.isBranch) {

        this.setData({

          open: !this.data.open,

        })

        //add test code by xdl 2020-10-9

        var itemid = e.currentTarget.dataset.itemid;

        console.log(“mytree goggle itemid:”+itemid)

        //根据itemid读取数据，改变model，重新渲染

        this.triggerEvent(‘toggle’, { itemid: itemid }, { bubbles: true, composed: true });

         //add by xdl 2020-10-9 end

      }

    },    

    tapItem: function(e) {

      var itemid = e.currentTarget.dataset.itemid;

      var value = e.currentTarget.dataset.value;

      this.triggerEvent(‘tapitem’, { value: value,itemid: itemid }, { bubbles: true, composed: true });

    }

  },

  ready: function(e) {

    this.setData({

      isBranch: Boolean(this.data.model.nodes && this.data.model.nodes.length),

    });

  }

})

父组件wxml文件：

<view class=‘com-selectBox’>

    <view class=‘com-sContent’ bindtap=‘selectToggle’>

        <view class=‘com-sTxt’>{{nowText}}</view>

        <image src=’/images/tree_show_more.png’  class=‘com-sImg’></image>

    </view>

    <view class=‘com-sList’ wx:if="{{selectShow}}">      

      <view wx:if=’{{ isBranch }}’ hidden=’{{ !open }}’>

        <checkbox-group bindchange=“checkboxChange”>

          <mytree wx:for=’{{ model.nodes }}’ wx:key=‘id’ model=’{{ item }}’  bind:tapitem=‘tapItem’  ></mytree>

         </checkbox-group>

      </view>     

    </view>

</view>

父组件js文件：

// Componet/Componet.js

Component({

  /**

   * 组件的属性列表

   */

    properties: {

      model: Object

    },

  /**

   * 组件的初始数据

   */

    data: {

        selectShow:false,

        nowText : “请选择”,

        open: true,

        isBranch: false,

    },

  /**

   * 组件的方法列表

   */

    methods: {

        selectToggle:function(){

            var nowShow=this.data.selectShow;

            this.setData({

                selectShow: !nowShow

            })

        },

        checkboxChange: function (e) {            

          console.log(“treeSelect checkboxChange:”+e.detail.value)           

          this.triggerEvent(‘checkboxChange’, { selectedIds: e.detail.value }, { bubbles: true, composed: true });

        },

        tapItem: function(e) {

          var itemid = e.detail.itemid;

          var value = e.detail.value;

          this.triggerEvent(‘tapitem’, { value: value,itemid: itemid }, { bubbles: true, composed: true });

          this.setData({

            selectShow: false,

            nowText:value

          })

        }

    },

    ready: function(e) {

      this.setData({

        isBranch: Boolean(this.data.model.nodes && this.data.model.nodes.length)

      });

    }

})

编译没问题，但无论怎样操作checkbox,都不能触发checkbox-group之bindchange事件，请各位老师指点迷津