iviewui Select 遠程搜索設置默認值label

 template

<FormItem label="醫院">
     <Select
        ref="hospitalInfo"
        v-model="queryVoHos.queryVO.hospitalId"
        filterable
        remote
        :remote-method="remoteMethod1"
        :loading="loading1"
        placeholder="請搜索並選中醫院"
        clearable
        @on-change="hospitalIdChange"
        label-in-value
        :label="hospitalName">
       <Option v-for="(option, index) in options1" :value="option.value"  
       :key="option.value">{{option.label}}</Option>
    </Select>   
</FormItem>

script

export default {
    data() {
      return {
        loading1: false,
        options1: [],
        hospitalName:"",
        queryVoHos:{
            queryVO:{
                hospitalId:"",
                }
        }
      }
    },
    mounted() {
        this.$refs["hospitalInfo"].query = "廣州市第一人民醫院";
    },
    methods: {
        remoteMethod1 (query) {
            clearTimeout(this.remoteMethod1.timer)
            if (query !== ''&&query.length>1) {
                this.loading1 = true;
                var timeoutflag = null;
                let queryVo={}
                    queryVo={
                        name:query,
                    }
                this.remoteMethod1.timer=setTimeout(() => {
                    this.loading1 = false;
                    this.getAllHospitals(queryVo);
                }, 800);
            } else {
                this.options1 = [];
                this.queryVoHos.queryVO.hospitalId=""
            }
        },
    }

}

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章