How to use array props in Vue 3?
You want to have a fruit component that accepts only a string from the array.
Fruit component
<template>
<div class="fruit">
{{ props.fruit }}
</div>
</template>
<script lang="ts"
export default defineComponent({
props: {
fruit: { type: String, required: true }
}
setup(props) {
return { props }
}
}
</script>
inside app.vue
<Fruit v-for="fruit in fruits" :key="fruit" :fruit="fruit"/>