在搞Echarts的關系圖graph，一開始正常顯示，如下：
然而就在本人修改了option里的curveness = 0.2，ctrl+f5強制刷新頁面后，圖表加載報錯：Error in mounted hook: "TypeError: Cannot read property 'get' of undefined"
一開始以為是因為curveness的修改而報錯，遂回退修改，然而問題依舊。
於是乎，研究一下報錯的地方，就是“axisModel = undefined”這個鬼東西報錯；
然后各種懷疑，懷疑dom組件加載未成功就進行了初始化，又懷疑echarts布局配置有bug（coordinateSystem: 'cartesian2d',），折騰半小時后無果。
於是使出最后一招“重啟開發環境”：重新npm run dev，問題解決。
后面試驗了一下，發現瀏覽器加載了npm run dev 緩存的東西，當動態v-if去改echarts顯示或不顯示時，也會報以上描述的錯。渣渣的我只能簡單的將該問題定義為：npm run dev緩存影響組件裝載。
附上options配置：
options: {
"xAxis": [{
"show": false,
"type": "value"
}],
"yAxis": [{
"show": false,
"type": "value"
}],
"animationDurationUpdate": 1500,
"animationEasing": "cubicOut",
"animationEasingUpdate": "quinticInOut",
"series": [{
"type": "graph",
"layout": "none",
"coordinateSystem": "cartesian2d",
"zlevel": 3,
"xAxisIndex": 0,
"yAxisIndex": 0,
"focusNodeAdjacency": true,
"symbolSize": 10,
"label": {
"normal": {
"show": true,
"fontSize": 12,
"position": "bottom",
"backgroundColor": "#fff",
"formatter": "{b}"
}
},
"edgeSymbol": ["circle", "arrow"],
"edgeSymbolSize": [0, 15],
"data": [{
"name": "10.200.51.51",
"value": [1, 0],
"createtime": "2019/10/08 14:00:45",
"itemStyle": {
"color": "#21B1ED"
}
}, {
"name": "10.200.51.52",
"value": [2, 20],
"createtime": "2019/10/08 14:01:51",
"itemStyle": {
"color": "#21B1ED"
}
}, {
"name": "10.200.51.53",
"value": [2, 120],
"createtime": "2019/10/08 14:01:51",
"itemStyle": {
"color": "#21B1ED"
}
}, {
"name": "10.200.51.54",
"value": [3, 40],
"createtime": "2019/10/08 14:02:51",
"itemStyle": {
"color": "#21B1ED"
}
}, {
"name": "10.200.51.55",
"value": [4, 60],
"createtime": "2019/10/08 14:04:51",
"itemStyle": {
"color": "#21B1ED"
}
}, {
"name": "10.200.51.56",
"value": [5, 80],
"createtime": "2019/10/08 14:08:51",
"itemStyle": {
"color": "#21B1ED"
}
}],
"links": [{
"source": "10.200.51.51",
"target": "10.200.51.52",
"lineStyle": {
"normal": {
"color": "#D1E1E7",
"opacity": 0.9,
"width": 1,
"type": "dashed",
"curveness": 0
}
}
}, {
"source": "10.200.51.51",
"target": "10.200.51.53",
"lineStyle": {
"normal": {
"color": "#D1E1E7",
"opacity": 0.9,
"width": 1,
"type": "dashed",
"curveness": 0
}
}
}, {
"source": "10.200.51.52",
"target": "10.200.51.53",
"lineStyle": {
"normal": {
"color": "#D1E1E7",
"opacity": 0.9,
"width": 1,
"type": "dashed",
"curveness": 0
}
}
}, {
"source": "10.200.51.52",
"target": "10.200.51.54",
"lineStyle": {
"normal": {
"color": "#D1E1E7",
"opacity": 0.9,
"width": 1,
"type": "dashed",
"curveness": 0
}
}
}, {
"source": "10.200.51.54",
"target": "10.200.51.55",
"lineStyle": {
"normal": {
"color": "#D1E1E7",
"opacity": 0.9,
"width": 1,
"type": "dashed",
"curveness": 0
}
}
}]
}],
"tooltip": {
"trigger": "item",
"backgroundColor": "#fff"
}
}