富文本编辑器 draft js

官方文档:https://draftjs.org/docs/getting-started

awesome:https://github.com/nikgraf/awesome-draft-js

draft js plugin:https://www.draft-js-plugins.com/

example:https://draftjs-examples.herokuapp.com/

how drafjs represent rich text:https://medium.com/@rajaraodv/how-draft-js-represents-rich-text-data-eeabb5f25cf2

draft js in zhihu:https://zhuanlan.zhihu.com/p/24951621

draft js + electron:https://www.jianshu.com/p/0d22b3bf96a5


富文本编辑器实现可视化的程序/表达式编辑

和具体业务无关

需求:

给定一些变量&常量&函数&运算符,生成一个返回一定内容和意义的表达式。

例如:

给定变量 {name: “时间1″, key:”time1″,value:”2018-01-01-00:01”}{name: “时间2″, key:”time2″,value:”2018-01-01-00:02”},其中key指代的是进行实际运算(就像在编译器里)使用的唯一值,name用于助记

运算符 + – * / > < ( )

生成rule:

time1 > time2

在某些情况下,如果key不友好,rule 的内容可读性不好,希望有如下情况

  > 

和更进一步的:加入函数等表示方式及其可视化(可读性更加)的表示方式和对应的交互:

例如将一个元素拖入编辑面板,删除一个元素(整体删除),光标的移动,more(redo, undo,copy,paste)