>source

파서를 번 들러로 사용하여 웹 프로젝트에서 Monaco 편집기를 구현하려고했지만 붙여 넣기 동작을 막는 것이 매우 어렵다는 것을 알게되었습니다 (사용자가 편집기에 코드를 붙여 넣기를 원하지 않습니다).

이것이 에디터를 초기화 한 방법입니다

import * as monaco from 'monaco-editor/esm/vs/editor/editor.main.js';
// set monaco web workers url
window.MonacoEnvironment = {
  getWorkerUrl: (moduleId, label)=> {
        if (label === 'json') {
            return '../language/json/json.worker.js';
        }
        if (label === 'css') {
            return '../language/css/css.worker.js';
        }
        if (label === 'html') {
            return '../language/html/html.worker.js';
        }
        if (label === 'typescript' || label === 'javascript') {
            return '../language/typescript/ts.worker.js';
        }
        return '../editor/editor.worker.js';
  }
};

export const monacoCreate = (MonacoConfig = {}, doc) => monaco.editor.create(doc, {
  value: [
    'function x() {',
    '\tconsole.log("Hello world!");',
    '}'
  ].join('\n'),
  language: "javascript",
  theme: "white",
  mouseWheelZoom: true,
  readOnly: false,
  showUnused: true,
  wordWrap: "on",
  selectionClipboard: false,
  ...MonacoConfig
});

이것은 내가 div 에서 에디터의 인스턴스를 만드는 방법이었다  아이디 code

const select = document.querySelector.bind(document);
const editor = monacoCreate({ language: language.html }, select('#code'));

지금 도전은 Monaco docs 를 읽는 것입니다 에디터에서 붙여 넣기 이벤트를 방지하는 내장 메소드를 찾을 수 없으며 주변을 둘러 보지도 않았습니다. 도와주세요.

  • 답변 # 1

    이 문제를 해결했습니다.

    모나코에는 onPaste() 가 내장되어 있습니다  이벤트를 반환하는 메서드 (편집기에서 붙여 넣은 항목의 위치) 내가 한 것은 모나코의 getModel 를 활용하는 것이었다   onPaste() 내의 방법  방법. 따라서 Monaco 편집기에 항목을 붙여 넣을 때 editor.getModel().undo() 를 사용하여 붙여 넣기 작업을 취소합니다.  방법.

    이것은 onPaste 이벤트 내에서 실행 취소를 트리거하여 수정 사항을 구현 한 방법입니다

    editor.onDidPaste(()=> {
        editor.getModel().undo();
      });
    
    

  • 이전 android - 노치 표시가있는 미디어 레코더의 크기를 설정하는 방법
  • 다음 android - 이온 키보드 이온 입력 포커스 문제