选择项目后自动清除选择字段 [英] clearing select field automatically after selecting item

问题描述

在选择项目后调用的方法afterselection"中，我找不到清除选择字段的方法:

I can't find a way to clear the select field in method "afterselection" which is invoked after selecting an item:

模板:

<v-select
 :items="adrlist"
 @input="afterselection"        
 ></v-select>

选择中的数据:

const addressList = [{
"text":"Street 523, 2533",
"value":[1723455.7054408004,5923451.382843224]},
{"text":"Lala 3, 3455",
"value":[1723455.7054408004,5923451.382843224],
}]

vue 代码:

new Vue({
  el: '#app',
  data () {
    return {
      adrlist: addressList,
    }
  },
  methods:{
    afterselection(item){
      console.log(item);
      //here I want to clear the select
    },
  },
})

这是带有此示例的代码笔:
codepen 示例

Here's a code pen with this example:
codepen example

我尝试将 v-model 设置为 null，但这不起作用.

I've tried to set the v-model to null, but this is not working.

我已经研究并尝试了几天，但我真的找不到解决方案:-/

I have researched and tried for several days now, and I really can't find a solution :-/

推荐答案

仅供参考，可以用

this.$nextTick(() => {
    this.selected = null  
  })

重要的是nextTick"！否则它不会被渲染...

the important thing is the "nextTick"! otherwise it wont be rendered...

查看 vuetify-dev 提供的这个 codepen:工作代码笔

see this codepen provided by a vuetify-dev: working codepen

这篇关于选择项目后自动清除选择字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！