jsmind를 사용하여 마인드 맵을 Vue 프로젝트의 그림으로 인쇄하고 내보내는 방법은 무엇입니까?

npm install jsmind --save

import jsMind from 'jsmind'
import 'jsmind/style/jsmind.css'

export default {
  mounted() {
    this.initMind()
  },
  methods: {
    initMind() {
      let mindData = {
        meta: {
          name: '思维导图',
        },
        format: 'node_tree',
        data: [
          {
            id: 'root',
            isroot: true,
            topic: '主题',
            direction: Mind.direction.right,
          },
        ],
      }
      let options = {
        container: 'jsmind_container',
      }
      let jm = new jsMind(options)
      jm.show(mindData)
    },
  },
}

<template>
  <div id="jsmind_container" style="width: 800px; height: 600px;"></div>
</template>

<template>
  <div>
    <div id="jsmind_container" style="width: 800px; height: 600px;"></div>
    <button @click="printMindMap">打印</button>
  </div>
</template>

export default {
  methods: {
    printMindMap() {
      window.print()
    },
  },
}

<template>
  <div>
    <div id="jsmind_container" style="width: 800px; height: 600px;"></div>
    <button @click="exportMindMap">导出为图片</button>
  </div>
</template>

export default {
  methods: {
    exportMindMap() {
      let canvas = this.$refs.jsmind_container.querySelector('canvas')
      let imgData = canvas.toDataURL('image/png')
      let link = document.createElement('a')
      link.href = imgData
      link.download = '思维导图.png'
      link.click()
    },
  },
}