具有V模型和数学计算的Vuejs .vue组件插槽

Question

在vuejs中，我知道我可以使用v模型来进行EG计算：

<input type="Text" v-model="quantity" />
{{price}}
={{ quantity * price }}

随着我们更改数量，这将动态更新总价格。但是，如果我想使用可重用的表，则可以使用如下范围的插槽：

<template slot="quantity"  slot-scope="{data}">
  <input type="Text" v-model="data.quantity" />
</template>

<template slot="total"  slot-scope="{data}">
  <b>Total:</b> {data.quantity * data.price}
</template>

Devtools中的数据对象中的数量会更新，但不会更新总计算。

我能做到这一点还是做错什么了？