.net 获取xml里面的值_vue项目中使用bpmnjson属性转xml

点击上面蓝字关注我们！

1

   

前情提要

   

    上一节我们讨论了将xml中的节点属性，转成前端常用的json格式。这一篇，我们来探讨更改了json后，如何写入到xml中去。首先，我们通过一张图看看流程图xml和json结构的对应关系。一定要仔细看，这张图理解了，这篇文章就理解一半了。

2

思路分析

    xlm中，属性包裹在中，下一层分别是和，inputParameter的下一层，会有三种格式。上一节我们读取属性也是按照这个顺序，层层遍历拿到的属性值。

     所以，我们本次的出发点，是根据json各字段的属性类型，从里向外为添加内容。步骤如下：

    1.通过elementRegistry.get 和节点id找到节点实例element，因为写入xml的时候需要知道为哪个节点写属性。
    2.bpmnFactory.create ，顾名思义，作用为创建标签。通过该方法创建元素，并通过对this.form的遍历，不断为其添加子元素。

    3.通过modeling.updateProperties(element, {});更新business中的节点xml。参数1步骤1中提到的节点实例element，参数2是步骤2生成的。

   

3

   

代码实现

     代码核心是生成，并为其添加子元素。上张图片中的this.form，属性值分为三种数据类型：
1.单一值：字符串(string)，数字(Number)或布尔(boolean)对应生成一个，且没有子元素
2.Object:
    2.1 数组 对应生成一个，且有子元素，包含多个。
    2.2 对象对应生成一个，且有子元素，包含多。
核心代码如下：

   

4

成果验证

    我们修改了表单项，通过控制台看一下最新的xml：

    可以看到，xml已经被更新，且值和页面中表单项的值完全一致，成功！

    直到现在，本系列“vue项目中使用bpmn-xxxx”七篇文章在博客中已经更新完成。内容都是总结自己开发中遇到的疑惑和知识点，不是很系统。还有很多小的知识点，没有纳入文章内，后面如果有需要，可能会在公众号更新。

    七篇文章的完整源码

Lemoncool

我在这里等你

等你和我一起探索前端世界