e-chan1007 / nuxt-monaco-editor

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

Dynamically change locale #32

Open starnayuta opened 1 year ago

starnayuta commented 1 year ago

How to change the locale dynamically? The locale should change dynamically when the user changes the locale like from en to ja.

https://e-chan1007.github.io/nuxt-monaco-editor/guide/configuration#locale

cc-hearts commented 1 year ago
<template>
  <MonacoEditor
    style="height: 100px"
    v-model="value"
    :lang="lang"
    ref="editorRef"
  />
  <button @click="toggleLanguage">goggle language</button>
</template>

<script setup>
import * as monacro from "monaco-editor";
const value = ref("");
const lang = ref("html");
const editorRef = ref(null);
const toggleLanguage = () => {
  const editor = toRaw(editorRef.value.$editor);
  monacro.editor.setModelLanguage(editor.getModel(), "javascript");
};
</script>

This is a demo that switches languages, I hope it can help you

starnayuta commented 1 year ago

@cc-hearts

Thanks for your comment.

The issue is not the language of the editor (e.g. javascript, css) but the locale (e.g. en, ja). https://e-chan1007.github.io/nuxt-monaco-editor/guide/configuration#locale

For example, if a user changes the locale from en to ja, we cannot tell nuxt-monaco-editor to change the locale.

I edited my comment to make the meaning clearer.

Thanks.

e-chan1007 commented 11 months ago

As far as I have tried, it is not able to change the locale dynamically due to the specification of monaco-editor. I will continue to find an alternative way to implement this.