AceEditor开发的坑

/** * Ace Editor 锁定或只读行封装 * @author CHANX 2020-11-21 * @param {ace} editor ace编辑器实例 * @param {number[]} [readOnlyLines = []] 需要锁定的行号 */
function setReadOnly(editor, readOnlyLines) {  const session = editor.session;  const Range = editor;  const readOnlyRanges = [];  for (let i = 0; i < readOnlyLines.length; i += 1) {    const newRange = [readOnlyLines[i] - 1, 0, readOnlyLines[i], 0];    // 此处原有代码range是当前行头到下一行头，我修改为当前行头到当前行1000位置    // 防止下一行头无法被编辑    readOnlyRanges.push({      start: {        row: readOnlyLines[i] - 1,        column: 0,      },      end: {        row: readOnlyLines[i] - 1,        column: 1000,      },    });  }  function before(obj, method, wrapper) {    const orig = obj[method];    obj[method] = function (...arg) {      const args = Array.prototype.slice.call(arg);      return wrapper.call(this, () => orig.apply(obj, args), args);    };    return obj[method];  }
  /**   * 当前选中范围和传入范围是否冲突   * @param {*} range   */  function intersects(range) {    return editor.getSelectionRange().intersects(range);  }  function preventReadonly(next, args) {    for (let i = 0; i < readOnlyRanges.length; i += 1) { if (intersects(readOnlyRanges[i])) return; }    next();  }  /**   * 当前选中范围和不可编辑行范围是否冲突   * @param {*} newRange   */  function intersectsRange(newRange) {    for (let i = 0; i < readOnlyRanges.length; i += 1) { if (newRange.intersects(readOnlyRanges[i])) return true; }    return false;  }  /**   * 是否在不可编辑行的末尾   * @param {*} position   */  function onEnd(position) {    const row = position.row;    const column = position.column;    for (let i = 0; i < readOnlyRanges.length; i += 1) { if (readOnlyRanges[i].end.row === row && readOnlyRanges[i].end.column === column) return true; }    return false;  }  /**   * 是否在不可编辑行的范围外   * @param {*} position   */  function outSideRange(position) {    const row = position.row;    const column = position.column;    for (let i = 0; i < readOnlyRanges.length; i += 1) {      if (readOnlyRanges[i].start.row < row && readOnlyRanges[i].end.row > row) { return false; }      if (readOnlyRanges[i].start.row === row && readOnlyRanges[i].start.column < column) {        if (readOnlyRanges[i].end.row !== row || readOnlyRanges[i].end.column > column) { return false; }      } else if (readOnlyRanges[i].end.row === row && readOnlyRanges[i].end.column > column) {        return false;      }    }    return true;  }  editor.keyBinding.addKeyboardHandler({    handleKeyboard(data, hash, keyString, keyCode, event) {      // 阻止不可编辑行行尾的回车      if (Math.abs(keyCode) === 13 && onEnd(editor.getCursorPosition())) {        return false;      }      if (hash === -1 || (keyCode <= 40 && keyCode >= 37)) return false;      for (let i = 0; i < readOnlyRanges.length; i += 1) {        if (intersects(readOnlyRanges[i])) {          return { command: "null", passEvent: false };        }      }    },  });  before(editor, "onPaste", preventReadonly);  before(editor, "onCut", preventReadonly);
  const old$tryReplace = editor.$tryReplace;  editor.$tryReplace = function (range, replacement) {    return intersectsRange(range) ? null : old$tryReplace.apply(this, arguments);  };
  /**   * 重写insert方法： 若postion在不可编辑范围内则不可插入   */  const oldInsert = session.insert;  session.insert = function (position, text) {    return oldInsert.apply(this, [position, outSideRange(position) ? text : ""]);  };  /**   * 重写remove方法： 若range在不可编辑范围内则不可以删除   */  const oldRemove = session.remove;  session.remove = function (range) {    return intersectsRange(range) ? false : oldRemove.apply(this, arguments);  };
  /**   * 重写moveText方法： 若toPosition在不可编辑范围内则可不以移动   */  const oldMoveText = session.moveText;  session.moveText = function (fromRange, toPosition, copy) {    if (intersectsRange(fromRange) || !outSideRange(toPosition)) return fromRange;    return oldMoveText.apply(this, arguments);  };}
export default setReadOnly;