См. Этот код:
https://codepen.io/anon/pen/gNOGmY?editors=1010
// HTML
<div id="app">
<v-app id="inspire">
<v-card>
<v-card-title class="headline font-weight-regular blue-grey white--text">Profile</v-card-title>
<v-card-text>
{{ searchedItems }}
<v-subheader class="pa-0">Where do you live?</v-subheader>
<v-autocomplete
v-model="model"
:items="states"
:label="State"
:search-input.sync="filter"
ref="selectExample"
>
</v-autocomplete>
</v-card-text>
</v-card>
</v-app>
</div>
// JS
new Vue({
el: '#app',
data () {
return {
model: null,
filter: '',
searchedItems: [],
states: [
'Alabama', 'Alaska', 'American Samoa', 'Arizona',
'Arkansas', 'California', 'Colorado', 'Connecticut',
'Delaware', 'District of Columbia', 'Federated States of Micronesia',
'Florida', 'Georgia', 'Guam', 'Hawaii', 'Idaho',
'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky',
'Louisiana', 'Maine', 'Marshall Islands', 'Maryland',
'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi',
'Missouri', 'Montana', 'Nebraska', 'Nevada',
'New Hampshire', 'New Jersey', 'New Mexico', 'New York',
'North Carolina', 'North Dakota', 'Northern Mariana Islands', 'Ohio',
'Oklahoma', 'Oregon', 'Palau', 'Pennsylvania', 'Puerto Rico',
'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee',
'Texas', 'Utah', 'Vermont', 'Virgin Island', 'Virginia',
'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'
]
}
},
watch:{
filter(newVal){
// I want to get the filtered items list here
this.searchedItems = this.$refs['selectExample'].items
}
}
})
Мой пример использования: когда пользователь вводит в поле ввода автозаполнения, список элементов фильтруется в раскрывающемся списке, и я хочу использовать эти отфильтрованные элементы.
В документах Vuetify не упоминается ни одной опоры, раскрывающей этот отфильтрованный список. Кто-нибудь знает, как я могу получить этот список в моем коде?
Заранее спасибо:)