RMind

by Mongkii

Mongkii / RMind

基于 React Hooks 与 flex 布局,实现了大部分功能的思维导图。 / An almost-full-function Mindmap web app developed with onl...

468 Stars 64 Forks Last release: Not found GNU General Public License v3.0 22 Commits 0 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

RMind

GPL 3.0 Code Size

RMind = React + Mindmap

基于 React Hooks 与 flex 布局,实现了大部分功能的思维导图。

An almost-full-function Mindmap web app developed with only React Hooks and flex layout.

在线演示:RMind Demo

📄 示例用导图文件

特点

  • 完全使用 React Hooks 开发,所有功能均由箭头函数实现
  • 用 flex 布局完成思维导图排版,唯一用到 canvas 的地方是绘制节点连接线

支持

  • 节点的增删改等基本功能
  • 拖拽操作
  • 撤销/重做
  • 导入及导出 .km(百度脑图) .md(Makrdown) .txt 格式的思维导图
  • 将导图保存为图片
  • 切换主题

演示

  • 拖拽操作

  • 键盘操作

  • 切换主题

操作方式

鼠标操作

  • 单击选中节点
  • 双击编辑节点文字
  • 拖拽移动节点

键盘操作

|功能|按键| |----|----| |切换所选节点|

/
/
/
| |添加子节点|
Tab
| |添加兄弟节点|
Enter
| |删除节点|
Backspace
/
Delete
| |修改节点文字|
F2
| |切换显示子节点|
Space
| |撤销|
Cmd/Ctrl
+
Z
| |重做|
Cmd/Ctrl
+
Shift
+
Z
|

编辑文字状态下:

|功能|按键| |----|----| |取消|

Esc
| |确认|
Enter
|

下一步计划

  • 自定义主题
  • 布局在紧凑/宽松间切换
  • 大纲等其他导图样式
  • Minimap + 导图缩放
  • 优化 Hooks 使用,避免不必要的渲染

致谢

项目中使用的 iconfont 来自 Zwicon,一款精美且免费的图标库。

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.