0

monaco-editor を使用して、ディレクトリ内のさまざまなファイルを表示したいと考えています。エディターを作成してコンテンツを動的に変更したい。しかし、それは私が望むようには機能しません。 

function doSomething(val) {
  require.config({ paths: { 'vs': 'min/vs' }});
  require(['vs/editor/editor.main'], function() {
    monEditor = monaco.editor.create(document.getElementById("content"), {
      value: val,
      language: "plain",
      scrollBeyondLastLine: false,
      readOnly: true
    });
  });
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<link type="text/css" href="min/vs/editor/editor.main.css" rel="stylesheet">

<body>
<!--- Modal start -->
<div id="content" style="height:100px; width: 100px;"> </div> <!-- Modal content -->
<!-- Modal end -->

<button onclick="doSomething('Input1')"> Change1 </button>
<button onclick="doSomething('Input2')"> Change2 </button>

<script src="min/vs/loader.js"></script>

</body>
</html>

これは私のコードです。初めてモーダルを開くと、すべて正常に動作しますが、monaco-editor が消えます。

使用しようとするmonEditor.setValue(val)と、monEditor が定義されていないというエラーが表示されます。

そして、エラーを使用しようとmonEditor.setModel(model)すると、ノードが見つからないことが表示されます。

私が間違っていること、またはそれを機能させるために何を変更する必要があるかを誰かが知っていますか? いろいろ試しましたが、エディタの設定がうまくいきません。残念ながら、サンプルにはリポジトリにないデータが含まれているため、どちらも役に立ちません。

4

1 に答える 1