I have one component in vue.js 2 and Vuetify that receive this data :
[ { "anio": 2022, "__typename": "Grupo" }, { "anio": 2020, "__typename": "Grupo" }, { "anio": 2018, "__typename": "Grupo" }, { "anio": 2017, "__typename": "Grupo" }, { "anio": 2016, "__typename": "Grupo" }, { "anio": 2015, "__typename": "Grupo" }, { "anio": 2014, "__typename": "Grupo" } ]
this object array
it´s used in :items
to v-autocomplete
property.
<v-autocomplete
v-model="anyo"
:items="listAnyos"
But my problem is that I need option selected v-model
that contains: 2023
but it never selected this option.
This data it´s getted from graphql
and it´s sending to other component. All data it´s in listAnyos
but i need to do, that if query graphql it´s empty set anyo
or current year in v-autocomplete
UPDATE
with response i change my code to try it:
<v-autocomplete
label="Select Year"
:items="filteredYears"
item-text="anio"
item-value="anio"
v-model="selectedYear"
></v-autocomplete>
and in methods:
calcularAnio() {
let anioActual = new Date().getFullYear();
let previousYear = anioActual.value - 1;
this.years.filter((year) => year.anio === anioActual.value || year.anio === previousYear.value)
}
i created a function and change anonymous functions to values in variables and years in props. But not run, not show any errors but not run
Thanks for readme and sorry for my bad english.
2
Answers
Pls try it, hope it would work. Receive current year(2023) from Javascript.
As per my understanding you want to assign current year into the autocomplete and make that selected as a default if you are not getting a correct value of
selectedYear
from the backend or API call.If Yes, Here is the working demo :