Code Mirror Получать текущий номер строки каждый раз, когда меняется содержимое - PullRequest
Новая
       9

Code Mirror Получать текущий номер строки каждый раз, когда меняется содержимое

0 голосов
/ 16 ноября 2018

Я пытаюсь использовать Code Mirror для создания текстового редактора.Я хочу показать текущий номер строки пользователю в нижней части экрана, как это делают текстовые редакторы.

До сих пор я пробовал это: 

function updateInfo(){
var lines = editor.lineCount();
document.getElementById('line-no.').innerText = lines;
editor.refresh();
}
editor.on("change", updateInfo());

line-no.span, где я хочу отобразить номер строки.Это работает для первого номера строки, но затем, когда я перехожу на другую строку, она ничего не делает.Консоль показывает эту ошибку: 

codemirror.js:2154 Uncaught TypeError: Cannot read property 'apply' of undefined
at codemirror.js:2154
at fireCallbacksForOps (codemirror.js:2111)
at finishOperation (codemirror.js:2125)
at endOperation (codemirror.js:3747)
at HTMLTextAreaElement.<anonymous> (codemirror.js:3884)

1 Ответ

0 голосов
/ 16 ноября 2018

Обновление

Чтобы следить за обновлениями в редакторе, зарегистрируйте обработчик для события cursorActivity.Это событие вызывается при изменении курсора или выделения.
Обработчик вызывается с экземпляром CodeMirror;при этом вы можете вызвать метод getCursor, чтобы получить объект, который содержит текущий номер строки, на которой активен курсор.
Обратите внимание, что номер строки равен нулюна основе, так что вы можете увеличивать или не увеличивать его на 1. 

const STATUS_CURRENT_LINE = document.getElementById('line-no.');

const onCursorActivity = (instance) => {
  const cursor = cm.getCursor();
  STATUS_CURRENT_LINE.textContent = cursor.line + 1;
}

editor.on("cursorActivity", onCursorActivity);

Установка номера текущей строки при изменении документа в редакторе

ошибка возникает из-за того, что обратный вызов updateInfo вызывается еще до того, как вы его зарегистрируете.Таким образом, значение, зарегистрированное в качестве обратного вызова, равно undefined. 

editor.on('change', updateInfo()) // -> editor.on('change', undefined)

. Это можно решить путем регистрации функции.

editor.on('change', updateInfo)

Однако подпись для обратного вызова должна следовать тому, что задокументировано.

Обратному вызову change передается instance CodeMirror и changeObject, из которого можно получить текущую строку.

"change" (instance: CodeMirror, changeObj: object)
Запускается каждый раз, когда изменяется содержимое редактора.changeObj - это объект {from, too, text, removed, origin}, содержащий информацию об изменениях, произошедших в качестве второго аргумента.from и to - это позиции (в системе координат перед изменением), где изменение начиналось и заканчивалось (например, это может быть {ch:0, line:18}, если позиция находится в начале строки # 19).text - это массив строк, представляющих текст, который заменил измененный диапазон (разделенный на строку).removed - это текст между from и to, который перезаписывается этим изменением.Это событие вызывается до окончания операции, прежде чем произойдет обновление DOM. 

const STATUS_CURRENT_LINE = document.getElementById('line-no.');

function updateInfo(instance, changeObj){
   STATUS_CURRENT_LINE.innerText = changeObj.to.line;
}

editor.on("change", updateInfo);
...