vue3中ctrl加回车换行，光标位置设置

<input  v-model="text"  type="textarea" @click="sbwz" @keydown="keysbwz" @keydown.enter.ctrl.exact.prevent="ctrlEnter"  />

 

// 暂存光标位置，后续截取换行使用

const textSplit=ref(0)

// 判断是否改变了上次光标位置

const isTest=ref(true)

// 获取光标位置

const sbwz=()=>{

  isTest.value=true

  // 延时获取鼠标位置，

  setTimeout(()=>{

    var textarea: any = document.querySelectorAll(".van-field__control")[0]; // 根据id获取文本框元素

    textSplit.value=textarea.selectionStart;

  },10)

}

// 监听键盘按下事件

const keysbwz=(event:any)=>{

  switch (event.keyCode) {

    case 37: // 左键

        sbwz()

        break;

    case 38: // 上键

        sbwz()

        break;

    case 39: // 右键

        sbwz()

        break;

    case 40: // 下键

        sbwz()

        break;

  }

}

// 回车加CTRL键 换行

let ctrlEnter = () => {

  text.value =text.value.substring(0,textSplit.value)+ '\n'+text.value.substring(textSplit.value);

  // 获取文本框元素

  var textarea: any = document.querySelectorAll(".van-field__control")[0]; // 根据id获取文本框元素

  textarea.value = textarea.value.substring(0,textSplit.value)+ '\n'+textarea.value.substring(textSplit.value);

  // 判断是否改变了光标位置，如果改变了则变为false。没有改变则将当前光标位置加一，方便下次换行使用

  if(isTest.value){

    isTest.value=false

  }else{

    textSplit.value= textSplit.value+1

  }

  textarea.setSelectionRange(textSplit.value+1,textSplit.value+1)

}