vue 后台获取列表型数据，加载下拉列表

实现效果

前端代码：

<!--v-model 实现双向数据绑定 绑定变量selectModel @change绑定changeModel($event)方法，为模型改变触发的函数-->
<select id='model' v-model="selectModel" style="width:100px" @change="changeModel($event)">
    <option>型号</option>
    <!--使用v-for对变量models进行遍历，每一项均作为select的option，{{item.name}}为显示的内容-->
	<option :value="item"  v-for="item in models" >{{item.name}}</option>
</select>

js：

data中声明变量selectModel及models

data:{	
    'selectModel':'型号',//初始select显示为型号
    'models':[]//models为数组类型
}

请求后台数据，赋值给models

getModels(id){
    var self = this;
    axios.get(‘请求地址’, {
        brandId: id+''//请求body参数
    })
    .then(function (response) {
        console.log(response);
        self.models=response.data.data;//赋值
    }).catch(function (error) {
        console.log(error);
    });
}

后台数据格式参考：

{"code":0,"data":[{"carId":9576,"name":"K 1600 GT"},{"carId":9577,"name":"R 1200 RT"},{"carId":9578,"name":"F 800 ST"},{"carId":9579,"name":"R 1200 R"}],"error":0,"message":"操作成功"}

获得选择框内容

changeModel(event){
    this.selectModel = event.target.value.name;
}