vuetify
vuetify copied to clipboard
fix(AutoComplete): don't alter search value when out of focus
Description
I removed the trigger of the search event when element is out focus.
resolves #19543
Markup:
<template>
<v-app>
<v-container class="mx-2">
<v-row>
<v-col>
<v-autocomplete
v-model="model"
:items="lista"
density="compact"
item-title="n"
item-value="id"
label="Label"
title="Choose one"
variant="outlined"
hide-no-data
@update:search="handleSearch"
/>
</v-col>
<v-col>
<v-btn @click="searchCount = 0">Clean Search Count</v-btn>
</v-col>
<v-col>Model: {{ model }} Search Count: {{ searchCount }}</v-col>
</v-row>
<v-row>
<v-col>
<ol>
<li>Choose one in list</li>
<li>Click outside autocomplete</li>
<li>Search occurs two times</li>
</ol>
</v-col>
</v-row>
</v-container>
</v-app>
</template>
<script setup lang="ts">
import { ref } from 'vue'
const model = ref(0)
const searchCount = ref(0)
const lista = ref([{ n: 'Choose one', id: 0 }, { n: 'test', id: 1 }, { n: 'test2', id: 2 }, { n: 'test3', id: 3 }])
function handleSearch (value: string) {
searchCount.value++
console.log(value)
}
</script>