[Vue 3] Vue 객체 배열 선언 방법

const children = ref([
    {name: '김하나', age : 30 , balance : 100000},
    {name: '김두리', age : 20 , balance : 10000},
    {name: '김서이', age : 10, balance : 1000},
])

 

props로 넘겨줄 때 주의사항

<div v-for="i in children">
<BusinessCardDetail  v-if="'i.name'!=undefined"
object:BusinessCards :name="i.name" :title="i.age" :indexx=i.balance
@delete-card-event="deleteCardEventt" />
</div>

 

이렇게 인자 하나하나를 보낼 때

balance의 값은 int 형이기에

<div v-for="i in children">
<BusinessCardDetail  v-if="'i.name'!=undefined"
object:BusinessCards :name="i.name" :title="i.age" :indexx="i.balance"
@delete-card-event="deleteCardEventt" />
</div>

 

" " 로 감싸서 보내면 문자열로 보내져서 값을 매칭시키지 못하는 오류가 발생한다