vue---使用van-filed组件华为手机无法换行

80 阅读 0 评论 53 点赞

我是靠谱客的博主欣慰酸奶，这篇文章主要介绍vue---使用van-filed组件华为手机无法换行，现在分享给大家，希望可以做个参考。

写在最前面

使用vue搭配vant做手机端项目时,测试提出的bug。 van-field有多行时，在华为手机上无法按换行键换行，只能一行输入满之后自动转入下一行。
目前还是不知道是手机的哪些参数导致的，oppo和小米都没问题，只有华为手机不可以。

解决方法

先阻止所有设备的换行动作，再手动添加换行
上代码

复制代码

1
2
3
4
5
6
7
8
9
10
11
<van-field
v-model="repairContent"
type="textarea"
placeholder="请输入现场情况记录"
rows="3"
clearable
:maxlength="100"
:border="false"
@keydown="handleEnter($event)"
/>

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13

methods: {
handleEnter(v){
if(v.keyCode==13){
v.cancelBubble=true
v.preventDefault()
v.stopPropagation()
return
this.repairContent = this.repairContent+'n'
}
}
}