一、问题
目前创新互联已为上1000家的企业提供了网站建设、域名、虚拟空间、成都网站托管、企业网站设计、响水网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。
vue中当用户提交表单时，有的数据需要去掉前后空格然后再向后端发送。
二、解决方法
首先可以使用v-model.trim这个v-model修饰符去解决它，但是当用户输入\u200B时，这个方法就不奏效了，这时我们可以去一下v-model.trim这个修饰符的源码
function genDefaultModel (
el: ASTElement,
value: string,
modifiers: ?ASTModifiers
): ?boolean {
const type = el.attrsMap.type
const { lazy, number, trim } = modifiers || {}
const needCompositionGuard = !lazy && type !== 'range'
const event = lazy
? 'change'
: type === 'range'
? RANGE_TOKEN
: 'input'
let valueExpression = '$event.target.value'
// 去掉空格
if (trim) {
valueExpression = `$event.target.value.trim()`
}
if (number) {
valueExpression = `_n(${valueExpression})`
}
let code = genAssignmentCode(value, valueExpression)
if (needCompositionGuard) {
code = `if($event.target.composing)return;$[code]`
}
addProp(el, 'value', `(${value})`)
addHandler(el, event, code, null, true)
if (trim || number || type === 'number') {
addHandler(el, 'blur', '$forceUpdate()')
}
}
上面的源码处理方式我们也可以理解为下面这种方式：
所以我们可以把上面的方法强化或者改进一下：
同理，使用这种方法我们可以定制一些其他功能的输入框组件
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持创新互联。
