Mini Program, custom components slot embedded custom components, the most custom components can not trigger events, how to solve?

desired effect

clipboard.png

my implementation

// 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"
    }
  }
})

result
the onTap of filter-option does not work, even console.log does not execute. I suspect that custom components are nested with slot, and custom components cannot bind events, let alone triggerevent.

ask
is there a way to achieve the function I want? Or is my usage and understanding wrong? Please give me some advice.

Menu