Question

我只是用vue.js填写了物化html select，但它只显示一项。我的HTML代码：

<select v-model="selectedBrand" 
        id="cboBrand"
        name="cboBrand">
    <option v-for="b in brandList" :value="b.Id">
       {{ b.Name }}
    </option>
 </select>

我的JavaScript代码：

mounted : function() {  
var vm = this;
M.AutoInit();
axios.get('MyUrl')
.then( function(response) {
 var data = response.data
 if (data.Status == 'OK') {
    vm.brandList = data.Data;
    console.log(JSON.stringify(vm.brandList));
    var cbo = document.getElementById("cboBrand");
    console.log(cbo);
    M.FormSelect.init(cbo);
  } else {
    M.toast({html: data.Message});
 }
})
.catch(function (error) {
  M.toast({html: error});
});

数据对象是：

{ 
"message": "", 
"currentAction": "", 
"selectedBrand": 1,
 "brandList": [ 
    { "Id": 1, "Name": "SportsBetting" }, 
    { "Id": 2, "Name": "BetsOnLine" } 
], 
"selectedAction": 1, 
"actionList": [], 
"selectedField": 1, 
"fieldList": [], 
"selectedType": 1, 
"typeList": [], 
"validationRows": [] 
}

我很肯定brandList中有数据，但是在select中仅显示数组的第一项...

TIA， Yamil

动态实现中刷新HTML选择

0 个答案: