Javascript 如何知道vue.js 3中哪个子级发出事件？

如果我有一个组件：

<product-display 
  :premium="premium" 
  :cart="cart" 
  @add-to-cart='updateCart' 
  @remove-from-cart='removeById'>
</product-display>

家长有以下方法：

 methods: {
        updateCart (id) {
            this.cart.push(id)
        },
        removeById(id) {
            const index = this.cart.indexOf(id)
                if (index > -1) {
                    this.cart.splice(index, 1)
                }
        }
    }

是否有一种方法可以从父级中删除一个方法，并且只使用

updateCart（id）

知道哪个子级发出事件

因此，在HTML中，您将得到：

 @add-to-cart='updateCart' 
 @remove-from-cart='updateCart'

---

你可以用几种不同的方法来做。我最喜欢的是这样的：

// Component.vue
updateCart(action) {
  this.$emit('update-cart', {
    id: this.variants[this.selectedVariant].id), action
}

// Component.vue
updateCart(action) {
  this.$emit('update-cart', {
    id: this.variants[this.selectedVariant].id), action
}

//Parent.vue
@update-cart='updateCart'

methods: {
  updateCard({id, action}) {
    if (action == 'add') {
      return this.cart.push(id);
    }
    this.card = this.card.filter(x => x != id);
  }
}