需求：
實作selector選擇器中選項值options 資料的動態顯示，而非寫死的資料，我的角色ID資料如下：
現在實作把這些資料請求顯示option上
實作如下：
使用element-ui中selector 選擇器：
<el-form-item label="角色ID：" prop="roleId">
<el-select v-model="addUserForm.roleId" placeholder="請選擇角色ID">
<el-option
v-for="item in roleList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
在data中自定義一個空陣列：
在methods 中寫實作資料的請求：
getroleList() {
getRoleList(this.name).then(res => {
let result = res.data.items;
console.log("角色獲取串列：" +JSON.stringify(this.roleList));
result.forEach(element => {
this.roleList.push({label:element.name,value:element.name});
});
}).catch( error => {
console.log(error);
});
},
在created 實作顯示：
其中getRoleList 是我封裝的get請求：
實作結果如下：
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/290696.html
標籤：其他