需求描述

现有一个查询列表功能，需根据某个条件进行查询，这个查询条件的值是从其它的地方粘贴的，粘贴之后的效果如下：

可以看到粘贴的仓库区域名称前面出现了空格，所以要解决的问题是去除前后两端的空格。

解决方案一

给每个输入元素框添加一个改变事件，首先拿到这个收入元素框中的值，然后调用trim()方法去除两端空格后，重新赋值给这个表单元素，实现代码如下：

<a-input placeholder="请输入物料编码" v-model="model.invmbCode" @change="clearInputInvmbCodeTrim"></a-input>

clearInputInvmbCodeTrim(){
  this.model.invmbCode = this.model.invmbCode.trim();
}

温馨提示：这里使用的前端框架是vue，其次不足是需要为每个表单元素都添加一个改变事件。

解决方案二（推荐）

这种方式是在vue中去除表单元素前后两端空格，在v-model后面添加.trim，实现代码如下：

<a-input placeholder="请输入物料编码" v-model.trim="model.invmbCode"></a-input>