element-ui,el-input实现按回车换行

html

<el-input :rows='8' type="textarea" ref="numTextarea" placeholder="请输入数量" v-model="form.textarea" @keyup.enter.native="enterLineFeed"></el-input>

js

enterLineFeed() {

  const myField = this.$refs.numTextarea.$refs.textarea
  
  let startPos = myField.selectionStart
  let endPos = myField.selectionEnd

  if(endPos != this.form.textarea.length){

    let startText = this.form.textarea.substring(0, startPos) + '\n'
    let endText = this.form.textarea.substring(endPos, this.form.textarea.length)
    
    this.form.textarea = startText + endText

    this.$nextTick(() => {
      myField.focus()
      myField.setSelectionRange(startPos + 1,endPos + 1)
    })

  }else{

    this.form.textarea += '\n'

  }

}

element-ui,el-input实现按回车换行
http://localhost:8090//archives/element-uiel-input-shi-xian-an-hui-che-huan-xing
作者
龟龟
发布于
2022年12月14日
更新于
2024年08月28日
许可协议