组件代码
<template>
<view v-for="(item, index) in dataList" :key="item.id" >
<slot :data="item"></slot>
</view>
</template>
<script setup>
import { ref, defineModel } from 'vue';
const dataList = defineModel('dataList', {type: Array, required: true})
console.log(dataList.value);
</script>
父组件代码
<template>
<TestA v-model:dataList="dataList">
<template #default={data}>
<input style="height: 30px; border: 1px solid #000; margin: 10px;" />
</template>
</TestA>
<button @click="deleteItem()">删除</button>
</template>
<script setup>
import { ref } from 'vue';
import TestA from '@/components/test-a.vue'
const dataList = ref([{
id: 1,
name: 'a',
}, {
id: 2,
name: 'b',
}, {
id: 3,
name: 'c',
}
])
function deleteItem() {
dataList.value.splice(0, 1)
}
</script>