jsMind 实现复制粘贴

最近在用jsMind做在线版的脑图设计器，发现缺少复制粘贴功能，就自己添加了一个。效果如下：

实现方法：

1.首先在mapping配置项中，增添C和V键

2.在整体事件监听方法内加上 ctrl+c 和 Ctrl+V 的判定

handler: function (e) {if (this.jm.view.is_editing()) { return; }var evt = e || event;if (!this.opts.enable) { return true; }var kc = evt.keyCode + (evt.metaKey << 13) + (evt.ctrlKey << 12) + (evt.altKey << 11) + (evt.shiftKey << 10);if(evt.keyCode==67||evt.keyCode==86) {if(evt.ctrlKey) {//加上Ctrl键判断if(evt.keyCode==67) this.handle_copy(this.jm, e);if(evt.keyCode==86)this.handle_paste(this.jm, e);}}else if (kc in this._mapping) {this._mapping[kc].call(this, this.jm, e);}
},

3.声明复制方法

注意：这里主要是把复制的节点信息数据保存下来。由于get_selected_node()获取到的不是个标准json对象，就没有处理直接保存到了window 中，你可以自行遍历，然后处理成所要的json后，放到localStorage里

handle_copy:function(_jm, e) {var evt = e || event;var selected_node = _jm.get_selected_node();window.jsMindCopyNode = selected_node;
},

4.声明粘贴方法

handle_paste:function(_jm, e) {var evt = e || event;var selected_node = _jm.get_selected_node();if (!!selected_node) {//jsMind会查找三次 select节点所以用 !!this._mapAddNode(_jm,selected_node,window.jsMindCopyNode);delete window.jsMindCopyNode;}
},

粘贴方法里，调用的是一个递归插入，因为复制的节点里可能含有子节点

//递归插入
_mapAddNode(_jm,parentNode,insertNode) {const me = this;var nodeid = jm.util.uuid.newid();if (!jm.util.is_node(insertNode)) return;var newNode =  _jm.add_node(parentNode,nodeid,insertNode.topic,{});if(insertNode.children) {insertNode.children.forEach(node=>{me._mapAddNode(_jm,newNode,node);});}
},

这样就大工告成了。

PS:

你也可以借助剪贴板，或者用clipboard.js 外部脚本，把处理成标准json数据格式的数据转成字符串存到剪贴板中

后来回看了下processon 里的做法，发现是把节点数据存入存到LocalStorage里的，

jsMind 实现复制粘贴相关推荐

程序员是复制粘贴的工具人？还是掌握“谜底”的魔术师？
作者 | David Heinemeier Hansson 译者 | 弯月出品 | CSDN(ID:CSDNnews) 编程世界在经历了"Imposter Syndrome(冒充者症候群/ ...
把大脑「复制-粘贴」到芯片上，三星、哈佛的大胆设想登上Nature子刊
视学算法报道编辑:张倩.蛋酱三星 & 哈佛:我们有一个大胆的想法-- 人的大脑有很多令人惊叹的优点,比如功耗低(相当于一个 20 瓦的灯泡).学习快(人类幼崽看几张图就可以学会一个概念). ...
vi/vim的选中/复制/粘贴命令
原文: https://www.cnblogs.com/GlassHour/p/5503973.html GlassHour vi/vim的选中/复制/粘贴命令选自http://blog.csdn. ...
竟有内鬼！北理工硕士生「复制粘贴」论文，旷视研究员最新声明
点击上方"小白学视觉",选择加"星标"或"置顶" 重磅干货,第一时间送达本文转自|AI算法与图像处理 [导读]过了半个多月,北理工硕士公然抄 ...
谷歌简单粗暴“复制-粘贴”数据增广，刷新COCO目标检测与实例分割新高度
点击上方"小白学视觉",选择加"星标"或"置顶" 重磅干货,第一时间送达近日,谷歌.UC伯克利与康奈尔大学的研究人员公布了一篇论文 Sim ...
为了不复制粘贴，我被逼着学会了JAVA爬虫
写在前边受疫情影响一直在家远程办公,公司业务进展的缓慢,老实讲活并没有那么多,每天吃饭.睡觉.逛技术社区.写博客,摸鱼摸得爽的很.早上本来还想在来个回笼觉,突然部门经理的语音消息就过来了. 甩给我一 ...
wps文档复制粘贴序号_10个文档处理神技能，学会让你少走很多弯路!
作者 | 职场叨叨君来源 | 办公资源(pptziyuan) Hello大家好,我是叨叨君~ 前段时间给大家更新了很多关于PPT技巧的内容,Word技术不溜的小伙伴跟我抱怨了:叨叨君你要雨露均沾,不 ...
一部手机，万物皆可复制粘贴，将AR玩出了新高度
点击上方"3D视觉工坊",选择"星标" 干货第一时间送达看到什么就复制什么,这是魔法还是孙悟空的神通?都不是.这是 AR 的魔力. 如何将一件物品的图像导入 ...
软件测试面试题-如何测试复制粘贴功能
复制粘贴是电脑最普遍的两个操作了,在面试的过程中,有学生被问到如何测试复制粘贴功能的时候,我个人觉得你可以这样去回答更多学习资源,公众号主页点击领取资料查看我评论区置顶首先,这道题目你甚至可以发 ...
我放弃了年薪200万的岗位，因为“复制粘贴”的技术活让人厌恶
题图 | Marrina Decisions 本文转自公众号「InfoQ」作者 | Michael Lin 编译 | 核子可乐褚杏娟 Michael Lin 跟随父母移居美国后,先后在 Netfl ...

jsMind 实现复制粘贴

实现方法：

jsMind 实现复制粘贴相关推荐

最新文章

热门文章