<script setup>
import { ref } from "vue"
import HelloWorld from './components/HelloWorld.vue'
const items = ref([
  {id: 1, text: "item 1"},
  {id: 2, text: "item 2"},
  {id: 3, text: "item 3"},
])

const addItem = () => {
  console.log('clicked')
  const id = Math.floor(Math.random() * 100)
  items.value.push({id: 4, text: "added item 4" })
}
const selected = ref(null)
</script>

<template>
  <ABtn @click="addItem"> test anu list with ref and dynamically update </ABtn>

  <AList v-model="selected" :items="items">
  </AList>

  selected: {{ selected }}
</template>