template

 <a-input placeholder="Basic usage"
                   :rows="4"
                   type="textarea"
                   ref="textDom"
                   v-model="message"
                   @blur="handleInputBlur"
                   @keydown.enter="handleEnter"
                   @keydown.alt.enter="handleAltEnter" />

script

data(){
	return{
		  blurIndex: undefined,
	      message: undefined,
	      flag: false,
	      isAltEnter: false
	}
},
methods:{
	 handleInputBlur (e) {
	      if (this.flag) {
	        this.blurIndex = e.srcElement.selectionStart;
	        // 把输入的换行符插入到你光标的位置
	        this.message = this.message.substring(0, this.blurIndex) + '\n' + this.message.substring(this.blurIndex, this.message
	          .length)
	        // 重新获取光标
	        e.srcElement.focus()
	        this.isAltEnter = true // 设置阻塞状态,因为enter事件仍然会触发
	      }
	      this.flag = false
	    },
    handleAltEnter (e) {
      this.flag = true
      // 失去光标触发事件
      e.srcElement.blur()
    },
    handleEnter (e) {
      e.preventDefault() // 阻止默认行为
      setTimeout(() => {
        if (this.isAltEnter) { //如果为阻塞状态就反转状态
          this.isAltEnter = false
        }else{
          // 回车你想做的事情
        }
      }, 100)
    },
}
Logo

前往低代码交流专区

更多推荐