Werte in Vue 3 werden in die V-Modell-Gleichung eingegeben

Question

Ich verwende vue3, aber es gibt ein Problem mit der Eingabe,

Ich möchte das Gleichungsergebnis für diesen Wert wie folgt anzeigen: <Nummer eingeben

id="integeronly"

        :value="element.qu * element.price"

      />

</td>

Das Problem ist aber, dass wenn ich die Zahl in die Eingabemenge eingebe, das Ergebnis nicht dynamisch aktualisiert wird, ich muss irgendwo klicken

Ich habe das V-Modell anstelle von :value ausprobiert, aber es funktioniert nicht

Wenn :value nicht möglich ist, könnten Sie mir bitte helfen, wie kann ich das mit dem V-Modell mit einer Funktion machen? Wenn ja, sagen Sie mir bitte, wie ich die Funktion schreiben soll

Answer 1

在此输入代码 这是代码：

它可以工作，但它不是动态的，它不会立即显示在输入上

Answer 2

尝试像下面的代码片段：

new Vue({
  el: '#demo',
  data() {
    return {
      elements: [{id: 1, ref: 'laptop', qu: 5, price: 15}, {id: 2, ref: 'mob', qu: 3, price: 10}]
    }
  },
  methods: {
    total(el) {
      return el.qu * el.price
    }
  }
})

Vue.config.productionTip = false
Vue.config.devtools = false