vue中使用mxgraph 默认工具栏

mxGraph库提供了一个默认的工具栏，其中包含了一些常用的工具按钮。要在Vue项目中使用mxGraph默认工具栏，您可以使用mxgraph中提供的`mxDefaultToolbar`类。首先，您需要安装mxgraph库：

npm install mxgraph --save

然后在需要使用mxGraph的组件中，使用以下代码引入mxGraph库：

import mxgraph from 'mxgraph';
const { mxGraph, mxRubberband, mxDefaultToolbar } = mxgraph();

接下来，在组件的`mounted`或`created`生命周期中，您可以创建mxGraph实例和mxDefaultToolbar实例：

const container = document.getElementById('graphContainer');
const graph = new mxGraph(container);
const toolbar = new mxDefaultToolbar(container, graph);

在这个例子中，我们将mxDefaultToolbar添加到了mxGraph容器元素上。您也可以将它添加到其他元素上。

现在，mxDefaultToolbar会自动在容器元素中显示。您可以通过以下代码指定它的位置：

toolbar.toolbar.style.position = 'absolute';
toolbar.toolbar.style.left = '10px';
toolbar.toolbar.style.top = '10px';

在这个例子中，我们将mxDefaultToolbar的位置设置为(10, 10)。

当您完成使用mxGraph和mxDefaultToolbar时，不要忘记在组件的`beforeDestroy`生命周期中销毁它们：

graph.destroy();
toolbar.destroy();