jason-chen-coder / mxgraph-easyfloweditor Goto Github PK

首先向Json表示感谢！本人近期也在研究mxgraph，您的这个详细的demo示例给我带来了非常非常大的帮助！
因为本人实际项目中涉及需要设置 word-break 的css属性，折腾了好几天总算搞定了。也发现了您代码中一些小瑕疵，以下提出来。
Mxgraph-EasyFlowEditor-1.0-beat\src\views\customToolbar\customToolbar.vue中，

• mxConstants.WORD_WRAP 设置有误
  style[mxConstants.WORD_WRAP] = "normal" 应改为 mxConstant.WORD_WRAP = 'normal' 或者 mxConstant.WORD_WRAP = 'word-break'
  本人查询源码中发现，源码是直接在设置css属性时，
  将mxConstant.WORD_WRAP的值直接拼接字符串 'word-warp:' + mxConstant.WORD_WRAP + ';'
• 由于mxgraph内没有内置word-break属性，通过style[mxConstants["word-break"]] = "break-all"设置是无效的。
• 最后，如果需要设置word-break属性，目前本人知晓的方法有两种：
  • 采用mxgraph内置相关API，设置 htmlLable 的方式赋值cell的title字段，该方式的缺点是会污染本身title字段，想要获取title字段内原本的内容需要从 htmlLable 中‘切割
  • 采用AOP装饰函数方式，复写源码中的mxSvgCanvas2D.prototype.getTextCss方法，该方法返回一个css字符串，负责cell设置基本的css样式。在原方法返回的css字段内，额外增加自己需要的 其他自定义基础css样式
  • 如果还有其他的方式，请一定告诉我！

可以参考分组节点上的用法, mxgraph是支持节点内容使用html渲染的,

Originally posted by @Jason-chen-coder in #23 (comment)