Vue integration
Let Vue supply the container and create and release Editor with component lifecycle.
Vue owns the page and interface; Editor owns editable content. A minimal integration needs an element reference and two lifecycle hooks, without copying the document into Vue state.
Start with one component
Create Editor in onMounted, using the element reference, and destroy it in onBeforeUnmount. This single-file example is runnable; installation and a walkthrough are in your first editor.
A local variable holds the instance. Use shallowRef<Editor>() when templates or other components need it; internal document and view objects do not need deep reactivity.
Let Vue manage interface state
For a Bold button, subscribe to Editor events and synchronize only the required boolean into Vue. Click handlers run commands rather than editing a second document and writing it back.
See the toolbar tutorial. Replace content explicitly when genuinely opening another document.
Nuxt and asynchronous loading
The server has no mounted element, so create DOM-backed Editor after browser mounting. Use a client component or ClientOnly for browser-specific capabilities. If asynchronous imports finish after unmount, do not create the instance.
Locale changes should update controls without replacing content, and theme changes should preserve undo history. For an existing paginated interface, see Classic Vue integration.