Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bpmn.js 常见问题(新问题可在此提出评论) #16

Open
miyuesc opened this issue May 27, 2021 · 41 comments
Open

Bpmn.js 常见问题(新问题可在此提出评论) #16

miyuesc opened this issue May 27, 2021 · 41 comments
Assignees
Labels
documentation Improvements or additions to documentation question Further information is requested

Comments

@miyuesc
Copy link
Owner

miyuesc commented May 27, 2021

1. 创建/更新元素属性,或者导出文件时报错 cannot read property 'isGeneric'

输入图片说明

原因:
常见于 Vue 项目。由于更新时 Bpmn 接收的参数类型应该为 ModdleElement 类型,但是在编写组件时将对应的数据保存进了 data() { return { } } 的某个数据中,所以被 vue 进行了响应式处理,更改了原型与属性,导致无法解析。

解决:
data () { } 中使用 _ 或者 $ 符号作为开头,或者不在 data 中进行声明直接对 this 进行赋值,可避免被响应式处理。

2. 导入xml或者创建新标签/属性时报错 Uncaught Error: unknown type xxx:xxx

输入图片说明

原因:
当前选用的表述文件(一个 json 文件, 比如该项目中 package/process-designer/plugins/descriptor/ 下的三个文件)不支持该标签/属性

解决:
根据需要的标签/属性类型,在对应的描述文件类增加对应的标签/属性。具体描述文件格式参见 bpmn 自定义解析文件

3. 更改元素/连线颜色

1. modeler 模式

直接使用 modeling.setColor(els, option) 方法更改元素颜色或者其他属性。

2. viewer 模式

  1. 使用 canvas.addMarker(elId, marker) 为元素添加一个 class 类名,之后为该类添加 css 样式。
  2. 使用 overlays.add(elId, option) 为元素添加一个遮罩层,为遮罩层添加 css 样式。

viewer 模式下的方式在 modeler 模式也可以使用。

@miyuesc miyuesc added documentation Improvements or additions to documentation question Further information is requested labels May 27, 2021
@miyuesc miyuesc self-assigned this May 27, 2021
@ajiua
Copy link

ajiua commented Jul 13, 2021

任务下面的处理用户、候选用户、候选分组可以自定义输入吗?用input输入,而不是用select

@JacZhoulang
Copy link

目前学习过程中碰到个问题,操作符 ?. 和 ?? 不知道为什么有时候运行eslint提示解析错误,有时候又正常,大佬有碰到过吗

@Justhing
Copy link

vue.min.js:6 Error: unknown type activiti:FormData
at Registry.mapTypes (bpmn-modeler.development.js:6543)
at Registry.getEffectiveDescriptor (bpmn-modeler.development.js:6568)
at BpmnModdle.Moddle.getType (bpmn-modeler.development.js:6793)
at BpmnModdle.Moddle.create (bpmn-modeler.development.js:6761)
at a.resetFormList (chunk-components.66ae9b67.js:1)
at a. (chunk-components.66ae9b67.js:1)
at Array. (vue.min.js:6)
at qe (vue.min.js:6)

这个是什么原因造成的?
通过npm run build 打包后运行。

@miyuesc
Copy link
Owner Author

miyuesc commented Oct 18, 2021

vue.min.js:6 Error: unknown type activiti:FormData at Registry.mapTypes (bpmn-modeler.development.js:6543) at Registry.getEffectiveDescriptor (bpmn-modeler.development.js:6568) at BpmnModdle.Moddle.getType (bpmn-modeler.development.js:6793) at BpmnModdle.Moddle.create (bpmn-modeler.development.js:6761) at a.resetFormList (chunk-components.66ae9b67.js:1) at a. (chunk-components.66ae9b67.js:1) at Array. (vue.min.js:6) at qe (vue.min.js:6)

这个是什么原因造成的? 通过npm run build 打包后运行。

错误提示已经给出来了,因为没有支持activi对应的formData标签,所以在切换的时候会提示找不到该类型。这个问题需要改业务组件代码。

@homeless2010
Copy link

目前学习过程中碰到个问题,操作符 ?. 和 ?? 不知道为什么有时候运行eslint提示解析错误,有时候又正常,大佬有碰到过吗

?. 和 ??不是标准的JavaScript运算符还提案阶段 可以配置babel解析

@homeless2010
Copy link

image
开关选择后流程画布reload后用户任务变任务

@miyuesc
Copy link
Owner Author

miyuesc commented Oct 20, 2021

image 开关选择后流程画布reload后用户任务变任务

你看看 App.vue 里面的逻辑吧。因为设置成用户任务是需要改变一些原生组件的,但是隐藏label这几个功能也需要改变原来的组件,需要重新实例化modeler,改变addis数组。之前写的时候没有搞,所以切换的时候会把用户任务那个组件挤出去

@homeless2010
Copy link

ok

@homeless2010
Copy link

image 开关选择后流程画布reload后用户任务变任务

你看看 App.vue 里面的逻辑吧。因为设置成用户任务是需要改变一些原生组件的,但是隐藏label这几个功能也需要改变原来的组件,需要重新实例化modeler,改变addis数组。之前写的时候没有搞,所以切换的时候会把用户任务那个组件挤出去

image
这样不就可以了吗,好奇为什么没有这样写,而是赋值空数组呢

@miyuesc
Copy link
Owner Author

miyuesc commented Oct 20, 2021

image 这样不就可以了吗,好奇为什么没有这样写,而是赋值空数组呢

之前还有别的操作,后来删掉了,所以就直接给空比较方便

@homeless2010
Copy link

vue.min.js:6 Error: unknown type activiti:FormData at Registry.mapTypes (bpmn-modeler.development.js:6543) at Registry.getEffectiveDescriptor (bpmn-modeler.development.js:6568) at BpmnModdle.Moddle.getType (bpmn-modeler.development.js:6793) at BpmnModdle.Moddle.create (bpmn-modeler.development.js:6761) at a.resetFormList (chunk-components.66ae9b67.js:1) at a. (chunk-components.66ae9b67.js:1) at Array. (vue.min.js:6) at qe (vue.min.js:6)
这个是什么原因造成的? 通过npm run build 打包后运行。

错误提示已经给出来了,因为没有支持activi对应的formData标签,所以在切换的时候会提示找不到该类型。这个问题需要改业务组件代码。

fromdata属于自定义标签,那这就需要后台扩展解析了,是这样子吧

@Justhing
Copy link

vue.min.js:6 Error: unknown type activiti:FormData at Registry.mapTypes (bpmn-modeler.development.js:6543) at Registry.getEffectiveDescriptor (bpmn-modeler.development.js:6568) at BpmnModdle.Moddle.getType (bpmn-modeler.development.js:6793) at BpmnModdle.Moddle.create (bpmn-modeler.development.js:6761) at a.resetFormList (chunk-components.66ae9b67.js:1) at a. (chunk-components.66ae9b67.js:1) at Array. (vue.min.js:6) at qe (vue.min.js:6)
这个是什么原因造成的? 通过npm run build 打包后运行。

错误提示已经给出来了,因为没有支持activi对应的formData标签,所以在切换的时候会提示找不到该类型。这个问题需要改业务组件代码。

方便说下原理吗?这个组建的加载的原理没太懂

@Thlnking
Copy link

你好,请问两个元素的ID相同时 会导致第二个元素的ID无法修改成功,但是页面没有任何提示请问有无解决方法

@bluefantasy728
Copy link

bluefantasy728 commented Dec 27, 2021

你好,我下载了你最新的代码跑起来后发现了一个问题。问题如图,就是一进页面,选择并放下一个圈后,点击其他地方让这个圈失去焦点,再次去点击这个圈,出现了右边的工具浮层,但是此时鼠标往工具浮层上移动的时候,这个工具浮层就消失了。
我尝试,点击页面右下角的工具图标,切换了流程引擎后,页面重新reload后这个问题就没了。我看了代码,在切换流程引擎的时候是调用了reloadProcessDesigner方法,但是我在进入页面1秒钟后直接调用reloadProcessDesigner方法,并不起作用,问题还在。
另外,我看了你的demo页面https://miyuesc.github.io/process-designer/,并没有发现这个问题
e4y36-20nhl.gif

@bluefantasy728
Copy link

你好,我下载了你最新的代码跑起来后发现了一个问题。问题如图,就是一进页面,选择并放下一个圈后,点击其他地方让这个圈失去焦点,再次去点击这个圈,出现了右边的工具浮层,但是此时鼠标往工具浮层上移动的时候,这个工具浮层就消失了。 我尝试,点击页面右下角的工具图标,切换了流程引擎后,页面重新reload后这个问题就没了。我看了代码,在切换流程引擎的时候是调用了reloadProcessDesigner方法,但是我在进入页面1秒钟后直接调用reloadProcessDesigner方法,并不起作用,问题还在。 另外,我看了你的demo页面https://miyuesc.github.io/process-designer/,并没有发现这个问题 e4y36-20nhl.gif

终于找到原因了,在App.vue文件里有个elementClick方法,我把里面this.modeler.on的2个绑定事件去掉就好了,应该是在给深灰色浮层添加了hover和out事件后产生的bug

@hakumen
Copy link

hakumen commented Jan 7, 2022

拽入甬道后bpmn:Participan操作其他节点报错

拽入甬道后,其他节点拖拽报错
企业微信20220107-101119

甬道添加子甬道时也会报错
企业微信截图_def68714-b120-4208-a15a-9ecbd98f4b1a

@CTheMyth
Copy link

CTheMyth commented Jan 7, 2022

烦请大佬有时间的时候写一篇自定义右侧属性栏的教程吧

@mirtok
Copy link

mirtok commented Apr 29, 2022

image
您好,请问怎么让 《消息开始事件,信号开始事件出现在左侧面板中,而不是点击扳手在出现的元素更改下拉框里面》

@15163789836
Copy link

你好 请问这个项目service task的外部任务相关部分在哪里呢,没有在项目里找到

@miyuesc
Copy link
Owner Author

miyuesc commented Jun 30, 2022

你好 请问这个项目service task的外部任务相关部分在哪里呢,没有在项目里找到

@15163789836 这个项目没有实现这个

@miyuesc
Copy link
Owner Author

miyuesc commented Jun 30, 2022

image 您好,请问怎么让 《消息开始事件,信号开始事件出现在左侧面板中,而不是点击扳手在出现的元素更改下拉框里面》

@mirtok 这个建议扩展一下左侧的 palette 构造函数,可参考 https://juejin.cn/post/6844904019454853127

@EthanYuen
Copy link

配置任务定时器生成的xml有问题
image
image

@15163789836
Copy link

大佬你好 请问这个项目里面有 DMN嘛

@miyuesc
Copy link
Owner Author

miyuesc commented Jul 15, 2022

大佬你好 请问这个项目里面有 DMN嘛

没有哈

@15163789836
Copy link

大佬 请问 bpmn里面 怎么自定义生成的xml标签名呀,
image
就生成这种。标签名 我想自定义成我需要的

@guanlulu222
Copy link

vue.min.js:6 Error: unknown type activiti:FormData at Registry.mapTypes (bpmn-modeler.development.js:6543) at Registry.getEffectiveDescriptor (bpmn-modeler.development.js:6568) at BpmnModdle.Moddle.getType (bpmn-modeler.development.js:6793) at BpmnModdle.Moddle.create (bpmn-modeler.development.js:6761) at a.resetFormList (chunk-components.66ae9b67.js:1) at a. (chunk-components.66ae9b67.js:1) at Array. (vue.min.js:6) at qe (vue.min.js:6)

这个是什么原因造成的? 通过npm run build 打包后运行。

同问

@miyuesc
Copy link
Owner Author

miyuesc commented Aug 25, 2022

vue.min.js:6 Error: unknown type activiti:FormData at Registry.mapTypes (bpmn-modeler.development.js:6543) at Registry.getEffectiveDescriptor (bpmn-modeler.development.js:6568) at BpmnModdle.Moddle.getType (bpmn-modeler.development.js:6793) at BpmnModdle.Moddle.create (bpmn-modeler.development.js:6761) at a.resetFormList (chunk-components.66ae9b67.js:1) at a. (chunk-components.66ae9b67.js:1) at Array. (vue.min.js:6) at qe (vue.min.js:6)
这个是什么原因造成的? 通过npm run build 打包后运行。

同问

见掘金文章 https://juejin.cn/column/6964382482007490590

这里面的问题都在文章里面可以找到,建议先看了再说

@miyuesc miyuesc closed this as completed Aug 25, 2022
@miyuesc miyuesc reopened this Aug 25, 2022
@nbacheng
Copy link

我想增加 定时边界事件的属性,老版本main分支的这个怎么增加?

@ActingCute
Copy link

流转条件,下拉none

@miyuesc
Copy link
Owner Author

miyuesc commented Feb 10, 2023

我想增加 定时边界事件的属性,老版本main分支的这个怎么增加?

参照掘金专栏,建议通过原生的面板定义一个边界事件之后解析元素的对象属性,再进行后面的代码编写

@miyuesc
Copy link
Owner Author

miyuesc commented Feb 10, 2023

流转条件,下拉none

没有复现,可以配合控制台截图

@airhonor
Copy link

流转条件,下拉none

没有复现,可以配合控制台截图

个人理解,条件设置这一块应该有点问题,首先是下拉none,我改了代码后,下拉选择表达式,报了错误!
WechatIMG86
WechatIMG85

@yuanfangCBC
Copy link

modeling.updateProperties..更新元素属性报错:TypeError: 'get' on proxy: property 'labels' is a read-only and non-configurable data property on the proxy target but the proxy did not return its actual value (expected '[object Array]' but got '[object Array]')

这个不能解决诶~

1. 创建/更新元素属性,或者导出文件时报错 cannot read property 'isGeneric'

输入图片说明

原因: 常见于 Vue 项目。由于更新时 Bpmn 接收的参数类型应该为 ModdleElement 类型,但是在编写组件时将对应的数据保存进了 data() { return { } } 的某个数据中,所以被 vue 进行了响应式处理,更改了原型与属性,导致无法解析。

解决: 在 data () { } 中使用 _ 或者 $ 符号作为开头,或者不在 data 中进行声明直接对 this 进行赋值,可避免被响应式处理。

@SilenceYangGao
Copy link

1690362125821
你好,我想问下每次进去都会有这个报错 Process is missing end event Process is missing start event Process is missing task node ;要怎么解决

@miyuesc
Copy link
Owner Author

miyuesc commented Jul 26, 2023

@SilenceYangGao 关掉流程校验功能

@Sawako666
Copy link

请问脚本任务里的 script标签应该如何生成

@tsprojectcode
Copy link

image
点击连接线上的用户任务后 直接报错 并且在进行任意画布操作就会死循环 疯狂报错
image

@Sawako666
Copy link

请问脚本任务里的 script标签应该如何生成

已在描述文件教程那里找到答案

@hao-qingyang
Copy link

自定义renderer中,如何实现使用html实现渲染,不使用图片,类似这种效果。
image

@miyuesc
Copy link
Owner Author

miyuesc commented Sep 6, 2023

自定义renderer中,如何实现使用html实现渲染,不使用图片,类似这种效果。

image

搜索svg绑定html标签就行了

@dreamerDH
Copy link

dreamerDH commented Nov 13, 2023

image
使用相容网关时一直会报这个error,有人知道是怎么回事儿吗

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation question Further information is requested
Projects
None yet
Development

No branches or pull requests