在摩納哥編輯器中禁用粘貼

Question

我試圖使用包裹作為捆綁程序在Web項目上實現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
});

這就是我在具有ID code的div創建編輯器實例的方式

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

現在的挑戰在於閱讀Monaco docs ，我找不到在編輯器中防止粘貼事件的內置方法，也沒有找到解決方法。 請幫忙。

Answer 1

找到了解決方法。

摩納哥有一個內置的onKeyDown()方法，該方法返回一個事件（有關按下的鍵和未按下的鍵的詳細信息）。 我所做的就是獲取按鍵的keyCode並檢查是否已按下CTRL或CMD按鍵。因此，在將項目粘貼到Monaco編輯器時，當CtrlOrCmd+v和CtrlOrCmd+c按鍵為按下。

下面顯示了我如何實施此修復程序

 editor.onKeyDown((event)=>{
    const {keyCode, ctrlKey, metaKey} = event;
    if((keyCode === 33 || 52) && (metaKey || ctrlKey)){
      event.preventDefault();
    }
  });