vuejs：vue-select组件不更新值

问题描述

我正在尝试将select b.* from b union all select a.* from a where not exists (select 1 from b where b.a = a.a); 组件用于下拉列表。到目前为止，我已经写了。

vue-select

将按预期填充下拉列表，然后选择一个Item将其插入输入字段中。我遇到的两个问题是

1. 选择某些内容后，<template> <div> <v-select label="name" key="id" :v-model="selected" :reduce="data => data.id" :options="items" @input="update()" /> </div> </template> <script> export default { props: { initial: { type: [String,Number],default: 0,},api_call: { type: String,required: true,data(){ return { value: this.initial,items: [],} },computed: { selected: { get() { return this.value; },set(val) { return this.value = val; } },methods:{ update() { console.log('selected',this.selected,this.value); this.$emit('input',this.selected); },getData: function(){ axios.get('/api/' + this.api_call) .then(function (response) { this.items = response.data; }.bind(this)); },created(){ this.getData(); } } 和value变量都不会改变。
2. 我还传递了一个selected值，希望将其作为列表中的默认值。

解决方法

从:指令中删除绑定符号v-model

 <v-select label="name" key="id"  v-model="selected" :reduce="data => data.id" :options="items" @input="update()" />

并像这样初始化value：

  data(vm){//vm refers to this

      return {
          value: vm.initial,items: [],}

  },

或：

  data(){

      return {
          value: null,mounted(){
this.value=this.initial
}