Nilai dalam input Vue 3 ke dalam persamaan model V

Question

Saya menggunakan vue3, tetapi terdapat masalah dengan input,

Saya ingin memaparkan hasil persamaan untuk nilai ini seperti ini: <Masukkan nombor

id="integeronly"

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

      />

</td>

Tetapi masalahnya ialah apabila saya memasukkan nombor dalam kuantiti input, hasilnya tidak dikemas kini secara dinamik, saya perlu klik di mana-mana

Saya mencuba model V dan bukannya :value tetapi tidak berkesan

Jika :value tidak mungkin, bolehkah anda membantu saya, bagaimana saya boleh melakukan ini menggunakan model v dengan fungsi? Jika ya, sila beritahu saya cara menulis fungsi

Answer 1

Masukkan kod di sini Ini kodnya:

sssccc

Ia berfungsi, tetapi ia tidak dinamik, ia tidak muncul serta-merta pada input

Answer 2

Cuba coretan kod seperti di bawah:

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

sssccc