vue绑定键盘事件enter,ctrl+enter,alt+enter以及其他组合键的使用。
最近项目需要im在线聊天功能,消息发送enter键,换行ctrl+enter,找了很多资料才解决,结合自己理解也扩展了一些内容,希望可以帮大家解决问题:下面是HTML代码<el-input@keydown.enter.native="keyDown"type="textarea":rows="4"class="text-input"placeholder="请输入内容"v-model="te
·
最近项目需要im在线聊天功能,消息发送enter键,换行ctrl+enter,找了很多资料才解决,结合自己理解也扩展了一些内容,希望可以帮大家解决问题:
下面是HTML代码
<el-input
@keydown.enter.native="keyDown"
type="textarea"
:rows="4"
class="text-input"
placeholder="请输入内容"
v-model="textarea">
</el-input>
下面是js代码
keyDown(e) {
if(e.ctrlKey && e.keyCode==13) { //用户点击了ctrl+enter触发
this.textarea += '\n';
}else { //用户点击了enter触发
this.sendMessage();
}
},
这样就完美解决了,如果你用的到alt或者其他快捷键的话,吧js里面的ctrlKey换成altKey就可以了,其他同理,我这边用的@keydown.enter.native,就是以enter结束才会触发,如果不是,这样写就可以了@keydown.native然后判断event里面的keycode就可以了。
更多推荐
已为社区贡献14条内容
所有评论(0)