VUE按钮快捷发送“按住Enter键发送消息,按住Alt+Enter键换行”

VUE 模仿微信消息发送按住Enter键发送消息,按住Alt+Enter键换行

主要现在网上的信息太乱了，找半天也找不到一个全的，自己写一个吧

按钮

<el-button type="primary"
                 icon="el-icon-chat-dot-round"
			    @click="sendMsg" title="按住Enter键发送消息,按住Alt+Enter键换行">消息发送</el-button>

这个时候在vue的script中return写入变量downCode来记录alt键是否按下，mounted中写入监听

export default {
  name: 'index',
  data() {
	    return {
			downCode:0,
            content :'' ,// 文本框绑定的v-model
		}
	},
	mounted () {
        var that = this
        document.onkeydown = () => {
            var key = window.event.keyCode
            if(key==17) 
            { 
                that.downCode=1;     
            } 
            if (key === 13) {
                if(that.downCode==1){
                    that.content = that.content+'\n'
                    that.downCode=0;    
                }else{
                    that.sendMsg()
                }
            }
        }
    },
    methods: {
        sendMsg(){
            console.log('发送消息.........')
        }
    }
}

非常简单，亲测可用! 大家可以试一下，有问题评论区见!