Как бы вы использовали документы Codemirror, чтобы получить несколько редакторов? - PullRequest
Новая
       7

Как бы вы использовали документы Codemirror, чтобы получить несколько редакторов?

0 голосов
/ 26 мая 2020

Я пытаюсь добавить вкладки в редактор Codemirror, чтобы иметь несколько редакторов, просто переключая вкладку.

Я получил эту базовую c реализацию, но не смог добиться прогресса https://codepen.io/mottox2/pen/wmGopW

В руководстве CodeMirror сказано, что это нужно сделать https://codemirror.net/doc/manual.html#api_doc

CodeMirror.Doc(text: string, mode: Object, firstLineNumber: ?number, lineSeparator: ?string)

Но я понятия не имею, где бы я поместил эту строку кода

1 Ответ

0 голосов
/ 03 июня 2020

Не уверен, что это ответ на ваш вопрос, это то, что вы ищете? Пример CodePen 

var editors = document.getElementsByClassName('editor');
for (var i = 0; i < editors.length; i++) {
  var self = editors[i];
  var editor = CodeMirror.fromTextArea(self, {
    mode: "javascript",
    lineNumbers: true,
    autoRefresh: true
  });
  editor.save();
}

var tabs = document.querySelectorAll('.tab');

for (var i = 0; i < tabs.length; i++) {
  var self = tabs[i];
  self.addEventListener('click', function() {
    var data = this.getAttribute('data-tab');
    document.querySelectorAll('.tab-pane.active')[0].classList.remove('active');
    document.querySelectorAll('.tab-pane[data-pane="'+data+'"]')[0].classList.add('active');
    document.querySelectorAll('.tab.active')[0].classList.remove('active');
    this.classList.add('active');
  });
}

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

...