vue-cli中使用mxgraph读取xml文件渲染画布失败问题及解决方案

在vue中用模块加载mxgraph的时候，读取xml渲染画布出现无效的问题。

后面发是vue中的 new mxCodec(xmlDocument); 这个在做鬼，不能正确解析xml里面的节点和线

解决方法一：
手动解析xml–>存储节点和线信息–>手动关联节点关系–>更新画布
以下代码复制可用

var graph = new mxGraph(this.$refs.graph);
var parent = graph.getDefaultParent();
    var xml = mxUtils.parseXml(this.xml);//this.xml为string格式数据
    var json = this.xmlToJson(xml);
    let mxGraphModelObj = json[0].mxGraphModel,
      root = mxGraphModelObj.childs[0].root,
      mxCells = root.childs;
    let cellsObj = {},
      edges = [];
    graph.getModel().beginUpdate();
    try {
    //循环处理节点cell 同时找出对应关系的线
      for (let i = 0; i < mxCells.length; i++) {
        let mxCell = mxCells[i].mxCell;
        if (mxCell.vertex) {
          const geometry = mxCell.childs[0].mxGeometry;
          var vertex = graph.insertVertex(
            parent,
            null,
            mxCell.value,
            geometry.x,
            geometry.y,
            geometry.width,
            geometry.height
          );
          vertex.id = mxCell.id;
          cellsObj["vertex" + vertex.id] = vertex;
        } else if (mxCell.edge) {
          edges.push(mxCell);
        } else {
          continue;
        }
      }
//拼接节点关联线
      for (let i = 0; i < edges.length; i++) {
        let edge = edges[i],
          geometry = edge.childs[0].mxGeometry;
        graph
          .insertEdge(
            parent,
            null,
            edge.value,
            cellsObj["vertex" + edge.source],
            cellsObj["vertex" + edge.target]
          )
          .setId(edge.id);
      }
    } finally {
      graph.getModel().endUpdate();
    }

以下xml文件