Vuetify——解决点击v-combobox框外侧数据更新问题

最新推荐文章于 2022-11-18 17:47:53 发布

贝塔贝卡贝

最新推荐文章于 2022-11-18 17:47:53 发布

阅读量987

点赞数 4

文章标签： VUE v-combobox input事件值更新表单提交

本文链接：https://blog.csdn.net/Kiruthika/article/details/121545678

版权

combobox组件，当修改值的时候，修改完之后需要点击修改框以外的地方，相当于失去焦点后获取的最终的input框的值，v-combobox组件中的值才能被更新，这样就会存在一个问题，如果用户修改后直接点击提交或保存，提交上的值还是更改前的值。

解决方法：@input.native

<v-combobox
    v-model="item.claim"
    :items="allSelectDatas[allDatas.type]"
    :item-value="item.claim"
    persistent-hint
    hint="身份源属性"
    :rules="rules.notNullRules"
    @input.native="
      item.claim = $event.target.value;
      hideDropdown = true;
    "
    :menu-props="{ ...(hideDropdown && { value: false }) }"
    @click="hideDropdown = false"
  >
  </v-combobox>