emis-frontend/src/views/emis/EmisBaseTools/ProvincePicker.vue

<template>
      <el-select
      style="width:100%"
      filterable
      clearable
      v-model="svalue"
      :placeholder="placeholder"
      @change="onChange">
      <el-option v-for="item in optionItems" :key="item.regionCode" :label="item.regionName" :value="item.regionCode" />
      </el-select>


</template>
<script>
  import { listSimpleEmisRegion } from "@/api/emis/emisRegion";

  export default {
    name: "ProvincePicker",
    props: {
      value: {
        type: [String, Number],
        required: false
      },
      countryCode: {
        type: String,
        required: false
      },
      placeholder: {
        type: String,
        required: false
      },

    },
    data() {
      return {
        optionItems: [],
        svalue: this.value,
      };
    },
    watch: {
      countryCode(newVal, oldVal) {
        this.queryData();
      }
    },
    created() {
      this.queryData();
    },
    methods: {
      onChange() {
        console.log("xxxxx00000:"+this.svalue)
        this.$emit("input", this.svalue);
        this.$emit("onChange",this.svalue);
      },

      queryData() {
        this.optionItems =[];
        if(!this.countryCode && !this.svalue){
          return;
        }

        let queryParams = {
          pageNum:1,
          pageSize:100,
          countryCode:this.countryCode,
          regionType:1
        };
        listSimpleEmisRegion(queryParams).then(response => {
          this.optionItems = response.rows;
        });
      },

    }
  };
</script>