Quill实现编辑器内插入内容【插入模板功能】

需求描述

在一个已有内容的quill富文本编辑器所呈现的文档中插入内容，格式是预先保存quill文档，是一个delta对象，要求在光标处进行插入

初步思路

首先要获取当前富文本编辑器中的内容对象，然后对这两个delta对象做内容拼接，之后再将最终的delta通过quill的setContents方法渲染回编辑器中

细化

还存在一个问题就是实现在光标中插入，由于delta对象是以换行或者样式切换座位分割内容对象的依据，所以即使我们能获取到光标的具体位置，也只能计算出大概要插入在那两个数组元素之间，如果要精确的插入到光标所在的位置，还需要对光标所在的数组元素进行分割处理，有点麻烦…懒得这么处理了

代码

insertValue(c) {
      // 获取光标位置
      // this.editor代表当前的quill实例
      var Range = this.editor.getSelection(true)
      // 获取编辑器原本的内容
      var n = this.getContents()
      var sum = 0,
        i = 0
      while (sum < Range.index) {
        sum = n.ops[i].insert.length + sum
        i++
      }
      // 获得了大概处于第几行
      n.ops.splice(i, 0, ...JSON.parse(c).ops)
      this.setContents(n)
    }