vue elemen-ui input选中光标_element input 鼠标选中

<el-input v-model="dataForm.content"
                  type="textarea"
                  :autosize="{ minRows: 4}"
                  id="emojiInput"></el-input>
1
2
3
4

// 选中光标
    makeActive (item, color) {
      var elInput = document.getElementById('emojiInput') // 根据id选择器选中对象
      var startPos = elInput.selectionStart// input 第0个字符到选中的字符
      var endPos = elInput.selectionEnd// 选中的字符到最后的字符
      if (startPos === undefined || endPos === undefined) return
      var txt = elInput.value
      // 将表情添加到选中的光标位置
      var result = txt.substring(0, startPos) + '$(' + item + ')' + txt.substring(endPos)
      elInput.value = result// 赋值给input的value
      // 重新定义光标位置
      elInput.focus()
      elInput.selectionStart = startPos + item.length + 3
      elInput.selectionEnd = startPos + item.length + 3
      this.dataForm.content = result// 赋值给表单中的的字段
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16