vueJS加jquery使用构建项目中v-model绑定的值无法清空

Posted 2020-10-28 通往代码之路

怎样清空v-model绑定的input值缓存

在vue+bootstrap+jquery构架您的项目中，列表中formatter格式化单元格显示的操作按钮绑定bootstrap模态框，在模态框弹出的页面中，用v-model绑定某个值后，点击模态框有上角的关闭模态框按钮，将模态框关闭掉，下一次点击列表中操作按钮，在模态框弹出后，页面中的input输入框在获得并失去焦点以后会缓存上次的值。

在各种给绑定值赋空取法清空的时候：

1 <input type="text" id="aptTrain" class="form-control" placeholder="车次" v-model.trim="aptTrain" @change="queryTrain(‘endStation1‘)" @focus="clear">

可以给input加一个focus事件，判断绑定的值是否为空，然后进行清空该值

 1 clear: function () {
 2                 var that = this;
 3                 // that.ticketGate = null;
 4                 // $(‘#ticketGate‘).val(‘‘);
 5                 if(that.ticketGate != null || that.ticketGate != ‘‘){
 6                     that.ticketGate = null;
 7                     $(‘#ticketGate‘).val(‘‘);
 8                 }else{
 9 
10                 }
11                 if(that.aptTrain != null || that.aptTrain != ‘‘){
12                     that.aptTrain = null;
13                     $(‘#aptTrain‘).val(‘‘);
14                 }else{
15 
16                 }
17 
18             }