我有两个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"}
],