第一步:下載npm包
npm install mxgraph --save
第二步:新建一個index.js文件
文件內容如下
import mx from 'mxgraph'; const mxgraph = mx({ mxImageBasePath: './src/images', mxBasePath: './src' }); // decode bug https://github.com/jgraph/mxgraph/issues/49 window.mxGraph = mxgraph.mxGraph; window.mxGraphModel = mxgraph.mxGraphModel; window.mxEditor = mxgraph.mxEditor; window.mxGeometry = mxgraph.mxGeometry; window.mxDefaultKeyHandler = mxgraph.mxDefaultKeyHandler; window.mxDefaultPopupMenu = mxgraph.mxDefaultPopupMenu; window.mxStylesheet = mxgraph.mxStylesheet; window.mxDefaultToolbar = mxgraph.mxDefaultToolbar; export default mxgraph;
這個是官方引入的方法。它將返回一個接受對象作為選析那個的工廠函數。必須將mxBasePath選項提供給工廠函數,而不是將其定義為一個全局變量。
在vue使用時方法的指向會發生變化,所以將其掛載到window上。
第三步:在index.vue或其他文件中引入
import mxgraph from 'index.js'; const {mxGraph, mxClient, mxCodec, mxUtils, mxConstants, mxPerimeter} = mxgraph;
總結
以上所述是小編給大家介紹的vue中引入mxGraph的步驟詳解,希望對大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會及時回復大家的!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。