[Vue.js] 리스트

<template>
  <ul class="mylist">
    <li
      v-for="(menuUseInfo, index) in myArray"
      :key="index"
    >
      {{ menuUseInfo.title }} <button
        class="torder_button_black"
        @click="push"
      >
        상세상태 추가
      </button>
      <ul
        v-for="(choco, index) in menuUseInfo.subtitle"
        :key="index"
      >
        {{ index+1 }}. {{ choco }}
      </ul>
    </li>
  </ul>
</template>

<script lang="ts" setup>
import { cloneWithoutLoc } from '@babel/types';
import { reactive } from 'vue';
const myArray = reactive([
  {
    title: '게임',
    subtitle: [
      '쿠키런',
      '랑그릿사',
    ],
  },
  {
    title: '강아지',
    subtitle: [
      '만두',
      '까불이',
    ],
  },
  {
    title: '고양이',
    subtitle: [
      '킷캣',
      '나비',
    ],
  },
  {
    title: '홈페이지 접수',
    subtitle: [
      '접수',
      '미접수',
    ],
  },
]);

const push = () => {
  .push('아이템1');
};
</script>