Vue + element realizes dynamic display of background data to options

need:

Realize the dynamic display of the option value options data in the [selector selector] , instead of hard-coded data, my role ID data is as follows:
Now realize the request to display these data on the option

The implementation is as follows:

[Use the selector selector] in element-ui :

      <el-option
          v-for="item in roleList"
          :key="item.value"
          :label="item.label"
          :value="item.value">
      </el-option>
    </el-select>
</el-form-item>

Customize an empty array in data:
write a request to implement data in methods:

getroleList() {
   getRoleList( this .name).then( res => {
      let result = res.data.items;
      console .log( "Role get list: " + JSON .stringify( this .roleList));
     result.forEach(element => {
        this.roleList.push({label:element.name,value:element.name});
     });
     }).catch( error => {
       console.log(error);
  });
},

The created implementation shows:
where getRoleList is my encapsulated get request:

The result is as follows:

Leave a Comment

Your email address will not be published. Required fields are marked *