vue打印功能遇到的问题（1）分页

mounted() {
    /**
     * 总结：
     * 1. insertBefore 插入的元素必须是 DOM对象；
     * 2. 插入元素之后，父节点下的children 已经发生改变，需要额外处理
     * 3. 插入的个数 * 次数 + 第几个元素 * （次数+1）-1
     * 4. addDivNum * count + positionNum * (count + 1) - 1 === i
     * 5. 第一次：2*0+12*1-1=11  i=11的是 是第十二个元素 插入
     * 6. 第二次: 2*1+12*2-1=25  i=25 则是第26个元素 但是之前插入过两个已经算进去DOM元素 所以应该是在第26个元素插入 +2 +4 +6 +8循环得
     * 7. 用forEach（值固定）时无法判断this.$refs.ticket.children.length   for（值不固定） 可以实时更新length的长度
     */
    this.$nextTick(() => {
      const that = this;
      const childs = this.$refs.ticket.children;
      let count = 0; // 计数插入元素次数
      let addDivNum = 2; // 需要插入 div的个数
      let positionNum = 12; // 在第几个元素后面插入的数
      for (let i = 0; i < this.$refs.ticket.children.length; i++) {
        const item = this.$refs.ticket.children[i];
        if (addDivNum * count + positionNum * (count + 1) - 1 === i) {
          if (item.nextElementSibling) {
            for (let i = 0; i < addDivNum; i++) {
              const div = document.createElement("div");
              div.style.pageBreakAfter = "always";
              that.$refs.ticket.insertBefore(div, item.nextElementSibling);
            }
            // 添加一组div后 计数+1
            count++;
          } else {
            const div = document.createElement("div");
            div.style.pageBreakAfter = "always";
            that.$refs.ticket.append(div);
          }
        }
      }
    });
  },