总结出子组件中的属性

Question

我有两个组件supplies和supply，我在supplies中执行了一个v-for，因此我创建了许多supply子级

<supply
  v-for="supply in supplies"
  :supply="supply"
  :key="supply.id"
 ></supply>

在提供的代码中，我可以选择一个quantity，然后将其与supply.price相乘，得到total

computed: {
  total () {
    return this.supply.price * this.quantity
  }
}

我想知道的是如何对所有supply组件中的所有total求和

提前谢谢你

Answer 1

组件可以通过事件与父级通信。查看'total‘计算属性并发出具有该值的事件(例如$emit('total-changed'，total))。然后侦听该事件并更新“supplies”父级上的状态(数据)。我总结了很多，但有很多方法可以做到这一点。这将取决于您的特定偏好/需求。