我正在研究vue-select。我可以将vue-select值保存在数据库中,但是在编辑表单时,vue-select的select元素的v-model值不会出现在选择框中。
This is a screenshot of what I mean
<v-select id="guest_type" name="guest_type" v-validate="'required'" v-model="form.guest_type" :options="getAllGuestTitle" :reduce="guest_title => guest_title.id" :label="`guest_title`" :class="{ 'is-invalid': form.errors.has('guest_type') }" ></v-select>
这是我正在使用的脚本。
<script>
export default {
name: "EditGuestComponent",
mounted(){
this.$store.dispatch("allGuestTitle")
axios.get(`/api/edit-guest/${this.$route.params.id}`)
.then((respose) => {
this.form.fill(respose.data.guest)
})
},
computed:{
getAllGuestTitle(){
return this.$store.getters.getGuestTitle
},
},
data(){
return {
form: new Form({
guest_type:'',
})
}
},
methods:{
updateGuest(){
console.log(this.form.guest_type)
this.form.post('/api/update-guest')
.then((response) => {
this.form.guest_type = ''
this.$router.push('/guest-list')
Toast.fire({
type: 'success',
title: ' Guest Updated successfully'
})
})
}
}
}
</script>