Установка showPrintMargin в false не работает в редакторе React Ace

#javascript #reactjs #ace-editor

#javascript #reactjs #ace-editor

Вопрос:

Я пытаюсь удалить вертикальную линию в моем редакторе react ace: введите описание изображения здесь

Я попытался установить printMargin в false, но, похоже, он не работает. Пробовал перезапустить сервер тоже, но ничего. Я также использую next.js если это поможет.

Вот как выглядит этот код:

 import ReactAce from "react-ace-editor";
import React from "react";

    function CodeEditor(props) {
      return (
        <ReactAce
          value={`function onLoad(editor) {
          console.log("i've loaded");
        }`}
          mode="javascript"
          theme="xcode"
          showPrintMargin={false}
          setReadOnly={false}
          setValue={props.value}
          style={{
            height: "500px",
            fontSize: "16px",
          }}
        />
      );
    }
    export default CodeEditor;
  

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

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

Ответ №1:

Вы используете react-ace-editor пакет npm, который не является оригинальным пакетом для react-ace. вероятно, поэтому эта опция не поддерживается. вместо этого вы должны использовать react-ace:

 import ReactAce from 'react-ace';
  

Тогда это будет работать, как эта демонстрация stackblitz.

(раскомментируйте showPrintMargin параметр, чтобы увидеть изменения.)