Как вызвать событие размытия «select», используя element-ui и vuejs после выбора опции? - PullRequest
Новая
       9

Как вызвать событие размытия «select», используя element-ui и vuejs после выбора опции?

0 голосов
/ 02 мая 2018

Я использую element-ui и vuejs. У меня есть элемент выбора, который выглядит следующим образом 

<el-form-item label="City" prop="city">
     <el-select 
            v-model="form.city" 
            multiple 
            filterable
            remote
            auto-complete = "address-level2"
            no-match-text = "No data found"
            :remote-method = "remoteMethod"
            :loading = "loading"
            placeholder="Select City">
          <el-option
            v-for = "(item,index) in cities"
            :key = "index"
            :label = "item.name"
            :value = "item.key"
          ></el-option>
     </el-select>
</el-form-item>

Теперь я хочу вызвать размытие этого выбора после того, как пользователь выберет параметр, чтобы раскрывающийся список свернулся.

Это мой дистанционный метод 

remoteMethod: _.throttle(function(query) {
        this.loading = true;
        axios({
            method: 'get',
            url: someUrl
        }).then(response =>{
            if(response.data.status === false){
                this.$notify.error({
                    title: 'Error',
                    message: response.data.message
                });
            }
            else if(response.data.status === true && response.data.data.length != 0){
                this.loading = false;
                this.cities = response.data.data;
            }
        })            
    }, 1500),

Ответы [ 2 ]

0 голосов
/ 18 июня 2018

Если вы хотите скрыть раскрывающиеся параметры после того, как пользователь выбирает параметр, просто сбросьте данные, полученные с удаленного устройства, при событии change.

Пример:

Вызвать метод resetData() при изменении выбранного значения: 

<el-form-item label="City" prop="city">
    <el-select 
      @change="resetData"
      v-model="form.city" 
      multiple 
      filterable
      remote
      auto-complete = "address-level2"
      no-match-text = "No data found"
      :remote-method = "remoteMethod"
      :loading = "loading"
      placeholder="Select City">
        <el-option
            v-for = "(item,index) in cities"
            :key = "index"
            :label = "item.name"
            :value = "item.key">
        </el-option>
    </el-select>
</el-form-item>

Сброс получения данных с пульта: 

resetData() {
    this.cities = [];
},
0 голосов
/ 03 мая 2018

вы можете установить свойство ref для компонента так же, как ref = "select1"

и затем вы можете вызвать метод фокусировки или размытия этим. $ Refs

просто так: this. $ Refs.select1.focus ()

см. http://element.eleme.io/#/en-US/component/select

...