How can I get Toast-UI editor content?

Question

I am a student studying.

I think I'm doing it conceptually wrong.

I'm trying to use vue3 and type script and I'm going to use Toast-UI editor.

I get an error.

refEditor.value.invoke is not a function.

How can I get Toast-UI editor content?

This is my code:

<template>
  <div class="markup-tables flex">
    <va-card :title="$t('tables.stripedHoverable')">
      <va-card-content>
        <div id="refEditor" ref="refEditor"></div>
        <br />
        <div class="row justify--end paginationButtons-left">
          <va-button class="mr-2 mb-2">List</va-button>
        </div>
        <div class="row justify--end paginationButtons-right">
          <va-button class="mr-2 mb-2" @click="getHTML">Save</va-button>
        </div>
      </va-card-content>
    </va-card>
  </div>
</template>

<script lang="ts">
import '@toast-ui/editor/dist/toastui-editor.css'

import Editor from '@toast-ui/editor'
import { defineComponent, onMounted, ref } from 'vue'

import data from '@/data/tables/markup-table/data.json'

export default defineComponent({
  name: 'BoardWrite',
  setup() {
    const refEditor = ref(null)

    const getHTML = () => {
      console.log('getHTML test')
      let html = refEditor.value.invoke('getHtml')
      console.log(html)
      // ERROR 
    }

    onMounted(() => {
      const editor = new Editor({
        el: refEditor.value,
        height: '700px',
        initialEditType: 'markdown',
        previewStyle: 'vertical',
      })
      editor.getMarkdown()
    })

    return {
      getHTML,
      refEditor,
    }
  },
})
</script>