Question

我有两个Vue选择实例，它们可以完美地工作。一个正在用硬编码选项填充，另一个正在通过axios返回对象填充，但是两个都在for循环中正确填充了选项。

我唯一剩下的问题是，我很难让他们加载默认的预选选项。假设我希望taskTypes的默认值是3，而taskLocations的默认值是10，所以我很难找到一种在Vue中实现此目的的方法

我尝试在返回中设置taskLocations.value，对于类型设置相同，但是不会加载任何值

<div class="form-group col-lg-6">
    <label>Locations</label>
    <select class="form-control" v-model="taskLocations" id="taskLocations" @change="handleLocationSelect">
      <option v-for="locationOption in locationOptions" v-bind:value="locationOption.id">{{ locationOption.name }}</option>
    </select>
</div>

<div class="form-group col-lg-3">
    <label>Choose Task Type</label>
    <select class="form-control" v-model="taskTypes" id="taskTypes" @change="handleTypeSelect">
     <option v-for="taskTypeOption in taskTypeOptions" v-bind:value="taskTypeOption.value">{{ taskTypeOption.name }}</option>
    </select>
</div>

  locationOptions: [],
  taskLocations: [],
  taskTypes: []
  taskTypeOptions: [
    {value:1, name:"PM"},
    {value:2, name:"OD"},
    {value:3, name:"All"}

  ],

Vue选择，预选选项

0 个答案: