[Vuejs]-Javascript object rendering only as last element in Vue app

The reason the object you provided prints only the last element is because object keys must be unique. When you define:

{
  id: 1,
  id: 2,
  id: 3,
}

It’s the same as:

{
  id: 3,
}

When you set multiple keys with the same name, only the last one remains in the object. The preceding ones are overwritten.

If you intend to keep multiple values for id, you’d likely want an array:

images.value = [
  {id: 1},
  {id: 2},
  {id: 3},
];

Then, to display them, you can use a loop in your template:

<template>
  <div id="app">
    <h2 v-for="image in images" :key="image.id">{{ image.id }}</h2>
  </div>
</template>