Using both modelValue or v-model to show default value is not showing. Please help.
Code: Select all
<template>
<div>
<div>
<AutoComplete
multiple
v-model="selectedCountry1"
:suggestions="filteredCountries"
@complete="searchCountry($event)"
field="name"
/>
</div>
</div>
</template>
<script>
import CountryService from "./service/CountryService";
export default {
data() {
return {
selectedCountry1: { name: "Afghanistan", code: "AF" },
};
},
countryService: null,
created() {
this.countryService = new CountryService();
},
mounted() {
this.countryService.getCountries().then((data) => (this.countries = data));
}
};
</script>