如何将项目值保存在其他变量的 v-autocomplete 中? [Vue.js + Vuetify]
How to save item-value in v-automplete in other variable? [Vue.js + Vuetify]
我不知道如何将项目值保存在 Vue.js 的组件 <v-autocomplete>
的变量中。我想保存在idLibro
.
<template>
<v-container grid-list-md>
<v-layout row wrap>
<v-autocomplete
:disabled="!isEditing"
:items="showTitleBooks"
:filter="customFilter"
color="white"
item-text="name"
item-value="id"
label="Book"
>
</v-autocomplete>
</v-layout>
</v-container>
</template>
<script>
export default {
data() {
return {
books: [],
showTitleBooks: [],
idLibro: "",
};
},
methods: {
getBooks() {
this.$axios
.get("http://localhost:8080/libros")
.then(data => {
this.books = data.data;
for (const i of this.books) {
this.showTitleBooks.push({ name: i.titulo, id: i.id_libro });
}
console.log(this.books);
})
.catch(() => {
console.log("No hay libros");
});
},
};
</script>
<v-autocomplete
v-model="idLibro"
>
</v-autocomplete>
我不知道如何将项目值保存在 Vue.js 的组件 <v-autocomplete>
的变量中。我想保存在idLibro
.
<template>
<v-container grid-list-md>
<v-layout row wrap>
<v-autocomplete
:disabled="!isEditing"
:items="showTitleBooks"
:filter="customFilter"
color="white"
item-text="name"
item-value="id"
label="Book"
>
</v-autocomplete>
</v-layout>
</v-container>
</template>
<script>
export default {
data() {
return {
books: [],
showTitleBooks: [],
idLibro: "",
};
},
methods: {
getBooks() {
this.$axios
.get("http://localhost:8080/libros")
.then(data => {
this.books = data.data;
for (const i of this.books) {
this.showTitleBooks.push({ name: i.titulo, id: i.id_libro });
}
console.log(this.books);
})
.catch(() => {
console.log("No hay libros");
});
},
};
</script>
<v-autocomplete
v-model="idLibro"
>
</v-autocomplete>