小程序，自定义组件slot内嵌自定义组件，最里面的自定义组件不能触发事件，如何解决？

Question

想要的效果

我的实现

<!-- index.wxml 想要的调用方式 -->
<filter title="订单时间筛选">
  <filter-option bind:tapoption="filter" data-type="time" data-direction="desc">
    <view>生成时间降序排列</view>
  </filter-option>

  <filter-option bind:tapoption="filter" data-type="time" data-direction="asc">
    <view>生成时间升序排列</view>
  </filter-option>
  
</filter>

/* index.json */
{
  "usingComponents": {
    "filter": "../../components/filter/filter",
    "filterOption": "../../components/filter-option/filter-option"
  }
}

// filter.json & filter-option.json
{
  "component": true
}

<!-- filter.wxml -->
<view>
  <view bindtap="taggle" bind:closefilter="closeFilter">{{title}}</view>
  <view wx:if="{{visible}}">
    <slot></slot>
  </view>
</view>

// filter.js
Component({
  options: {
    multipleSlots: true // 在组件定义时的选项中启用多slot支持
  },
  properties: {
    title: {
      type: String,
      value: ''
    }
  },
  data: {
    visible: true
  },
  methods: {
    taggle () {
      console.log("taggle")
      this.setData({
        visible: !this.data.visible
      })
    },
    closeFilter () {
      this.setData({
        visible: false
      })
    }
  },
  relations: {
    '../filter-option/filter-option': {
      type: 'child'
    }
  }
})

<!-- filter-option.wxml -->
<view bindtap="onTap">
    <slot></slot>  
</view>

// filter-option.js
Component({
  methods: {
    onTap () {
        console.log("i clicked");
        this.triggerEvent('tapoption', {}, {
            bubbles: true,
            composed: true
        });
        this.triggerEvent('closefilter')
    }
  },
  relations: {
    '../filter/filter': {
      type: 'parent'
    }
  }
})

结果
filter-option的onTap没有起效果，就是console.log也没执行，我怀疑，自定义组件用slot嵌套自定义组件，里面的自定义组件不能绑定事件，更不用谈triggerevent了。

请教
请问有方法实现我要的功能吗？或者是我的用法和理解错了？请指教。