安装

npm install @hellowuxin/mindmap
or
yarn add @hellowuxin/mindmap

vue中使用

<template>
  <div class="nav">
    <mindmap
      height="500"
      width="100%"
      nodeClick
      zoomable
      showNodeAdd
      v-model="data"
    ></mindmap>
  </div>
</template>

<script>
import mindmap from "@hellowuxin/mindmap";

export default {
  components: { mindmap },
  data() {
    return {
      data: [
        {
          name: "思维导图",
          children: [
            {
              name: "标题一",
              children: [
                { name: "内容一" }, 
                { name: "内容二" }
              ],
            },
            {
              name: "标题二",
              _children: [{ name: "折叠节点" }],
            },
            {
              name: "标题三",
              left: true,
              children: [
                { name: "内容一" }, 
                { name: "内容二" }
              ],
            },
          ],
        },
      ],
    };
  },
};
</script>

API