[Vuejs]-V-model keeps showing the same data in vuejs

by

0👍

If you’re using Vue 3 you can easily use Ref in your array in order to get this changes

<script setup lang="ts">
import { ref } from 'vue'

interface Passenger {
  firstname: string
  lastname: string
}

// update v-model
const passengers = ref<Passenger[]>([
  {
    firstname: 'John',
    lastname: 'Doe',
  }
])
</script>

<template>
  <div v-for="(passenger, passengerIndex) in passengers">
    <label>first name {{ passenger.firstname }}</label>
    <input v-model="passenger.firstname" />
  </div>
</template>

Hope this helps out

Leave a comment