Vue 中如何添加文字到鼠标的点击位置

啥都不说~先上图

不对，搞错了

是这样的~~~~~~~~~~~~~~~

具体代码如下：

<el-form-item label="文案内容" style="margin-top:40px">
            <el-input
              maxlength="200"
              type="textarea"
              id="textarea"     #设置id 方便下文找到
              show-word-limit
              rows="4"
              v-model="form.documentContent"
            ></el-input>
</el-form-item>

method:{
    
   # value 值是你需要插入的文本内容
 async insertVariable(value) {
      const myField = document.querySelector('#textarea');
      if(myField.selectionStart || myField.selectionStart === 0) {
        let startPos = myField.selectionStart;
        let endPos = myField.selectionEnd;
        this.form.documentContent = myField.value.substring(0, startPos) + value
          + myField.value.substring(endPos, myField.value.length);
        await this.$nextTick() 
        myField.focus();
        myField.setSelectionRange(endPos + value.length, endPos + value.length);
      } else {
        this.form.documentContent = value;   #这儿是定义的文章内容
      }
    },
}

 

over~~~~~~~~~~~~~~~~~~