vue调用接口，做成select下拉框

1.实现效果

2.代码

(1)下拉框

(2)引入对应的数据接口

import { getProcessSelectList } from "@/api/system/process";

(3)定义一个字段 ，调用接口函数

data() {
    return {
      proOptions: [],
    };
},
created() {
    this.getproKey();
},
methods: {
    getproKey() {
      this.loading = true;
      getProcessSelectList().then((response) => {
          this.proOptions = response.data;
          //console.log(this.proOptions);
        })
        .catch((err) => {
          console.log(err);
        });
     },
},

 附：接口写法

export function getProcessSelectList(query) {
    return request({
      url: '/process/getProcessSelectList',
      method: 'get',
      params: query
    })
  }