hellowuxin-mindmap

预览

文档

@hellowuxin/mindmap

安装

npm install @hellowuxin/mindmap

使用

:::details 点击查看代码

<template>
  <mindmap
    v-model="data"
    :height="800"
    :draggable="false"
    :showNodeAdd="false"
    :contextMenu="false"
    :showUndo="false"
    :download="false"
  ></mindmap>
</template>

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

export default {
  components: { mindmap },
  data: () => ({
    data: [
      {
        name: "如何学习D3",
        children: [
          {
            name: "预备知识",
            children: [{ name: "HTML & CSS" }, { name: "JavaScript" }],
          },
          {
            name: "安装",
            _children: [{ name: "折叠节点" }],
          },
        ],
      },
    ],
  }),
};
</script>
<style>
#mindmap svg {
  height: 800px;
}
</style>

:::