CodeMirror с несколькими строками не отображается, пока что-то не вызовет перерисовку

#javascript #codemirror

#javascript #codemirror

Вопрос:

CodeMirror, похоже, работает очень хорошо, за исключением случаев, когда у меня всего несколько (3 или менее) строк кода в текстовой области. Когда это происходит, текстовая область остается пустой, пока я (А) не нажму enter в текстовой области или (Б) не сделаю что-то, что заставит браузер перерисовывать (например, изменять размер). Когда строк больше 3, они отлично отображаются при первом рендеринге страницы.

Я здесь ничего особенного не делаю:

 var editor = CodeMirror.fromTextArea(document.getElementById('html'), {
    mode: 'text/html',
    tabMode: 'indent',
    lineNumbers: true
});
  

Просто интересно, сталкивался ли кто-нибудь еще с этой проблемой.

Комментарии:

1. У меня возникли проблемы с codemirror 2.34, как при создании из a <textarea> , так и при создании заново с использованием подхода «new CodeMirror (node)». Этому вопросу больше года, но помните ли вы, нашли ли вы, в чем проблема?

2. Нет. И с тех пор мы потеряли необходимость во всем этом вместе.

3. Я столкнулся с той же проблемой, но использовал только обновление для обхода.

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

5. У меня была такая же проблема, и я также использовал метод обновления, чтобы обойти ее. Но вы можете связать его с событием onBlur в текстовой области.

Ответ №1:

Используйте метод обновления после создания экземпляра CodeMirror… editor.refresh() Это случилось со мной при попытке вставить редактор в dijit.Диалог, когда я был еще скрыт. Это помогло мне.

Ответ №2:

Я настроил сценарий, в котором не было проблем в Chrome, используя от 0 до 2 строк кода несколькими разными способами.

Я напрямую связался с codemirror для включения.

У вас последняя версия?

С какой средой у вас возникли проблемы?

Возможно, это проблема, связанная с браузером?

 <link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css">
<script src="http://codemirror.net/lib/codemirror.js"></script>
<script src="http://codemirror.net/addon/fold/foldcode.js"></script>
<script src="http://codemirror.net/addon/fold/foldgutter.js"></script>
<script src="http://codemirror.net/addon/fold/brace-fold.js"></script>
<script src="http://codemirror.net/addon/fold/xml-fold.js"></script>
<script src="http://codemirror.net/mode/javascript/javascript.js"></script>
<script src="http://codemirror.net/mode/xml/xml.js"></script>

<textarea id='someID1'></textarea>

<textarea id='someID2'>
    <table><tr><td>The wheels on the bus go round and round.</td></tr>
    </table>
</textarea>

<script>
    var editor = CodeMirror.fromTextArea(document.getElementById('someID1'), {
        mode: 'text/html',
        tabMode: 'indent',
        lineNumbers: true
    });

    CodeMirror.fromTextArea(document.getElementById('someID2'), {
        mode: 'text/html',
        tabMode: 'indent',
        lineNumbers: true
    });
</script>
  

Комментарии:

1. Я также скопировал это непосредственно в jsFiddle, и это сработало нормально.