Composition API

<script setup>
import { ref, computed, onMounted } from "vue";

const items = ref([1, 2, 3]);
const doubled = computed(() => items.value.map(x => x * 2));

function add() {
  items.value.push(items.value.length + 1);
}

onMounted(() => {
  console.log("Component mounted");
});
</script>

<template>
  <button @click="add">Add</button>
  <ul>
    <li v-for="n in doubled" :key="n">{{ n }}</li>
  </ul>
</template>