在摩纳哥编辑器中禁用粘贴

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();
    }
  });