|
|
@ -3,13 +3,13 @@ |
|
|
|
{{ emptyText || 'No items' }} |
|
|
|
</div> |
|
|
|
<div v-else class="flex flex-col"> |
|
|
|
<div v-for="(item, i) in data" :key="item"> |
|
|
|
<div v-for="(item, i) in data" :key="i"> |
|
|
|
<input |
|
|
|
:value="item" |
|
|
|
:name="name" |
|
|
|
type="text" |
|
|
|
class="rounded-lg border-2 border-gray-100 text-gray-500 focus:border-red-800 focus:outline-0 focus:ring-0 dark:border-neutral-800 dark:bg-neutral-700 dark:text-neutral-200 dark:placeholder:text-neutral-400" |
|
|
|
@input="update(i)" |
|
|
|
@input="update($event, i)" |
|
|
|
/> |
|
|
|
<input type="button" value="-" @click="del(i)" /> |
|
|
|
</div> |
|
|
@ -21,13 +21,12 @@ |
|
|
|
const data = defineModel<string[]>(); |
|
|
|
defineProps<{ emptyText?: string[]; name: string }>(); |
|
|
|
|
|
|
|
function update(i: number) { |
|
|
|
return (v: string) => { |
|
|
|
if (!data.value) { |
|
|
|
return; |
|
|
|
} |
|
|
|
data.value[i] = v; |
|
|
|
}; |
|
|
|
function update(e: Event, i: number) { |
|
|
|
const v = (e.target as HTMLInputElement).value; |
|
|
|
if (!data.value) { |
|
|
|
return; |
|
|
|
} |
|
|
|
data.value[i] = v; |
|
|
|
} |
|
|
|
|
|
|
|
function add() { |
|
|
|