e-chan1007 / nuxt-monaco-editor

Integrate monaco-editor with Nuxt
https://e-chan1007.github.io/nuxt-monaco-editor
MIT License
114 stars 15 forks source link

[DiffEditor] Errors in Monaco Diff Editor #39

Closed Sun-ZhenXing closed 9 months ago

Sun-ZhenXing commented 10 months ago

Source: src/runtime/MonacoDiffEditor.client.vue#L55

Perhaps there was a spelling mistake. originalModel should be modifiedModel?

Here's another counter-intuitive feature: when the language changes the entire editor is reset, including the content.

MonacoDiffEditor can be editable. And it provides no interface to text changes, so changes to its internal text are not perceptible, and a reset will clear all its internal state.

So I think the current content should be copied out and put into new Model.

Just like this:

// Updated: do not use ref
const editor = shallowRef<Monaco.editor.IStandaloneDiffEditor | null>(null)

watch(() => language.value, () => {
  if (!editor.value)
    return
  const monaco = useMonaco()!
  const originalModel = editor.value.getModel()?.original
  const modifiedModel = editor.value.getModel()?.modified
  const originalValue = originalModel?.getValue() || ''
  const modifiedValue = modifiedModel?.getValue() || ''
  if (originalModel)
    originalModel.dispose()
  if (modifiedModel)
    modifiedModel.dispose()
  const newOriginalModel = monaco.editor.createModel(originalValue, language.value)
  const newModifiedModel = monaco.editor.createModel(modifiedValue, language.value)
  editor.value.setModel({
    original: newOriginalModel,
    modified: newModifiedModel,
  })
})