vue-cli ——解决多次复用含有Echarts图表组件的问题

前言

　在vue项目里，组件复用是一件很开心的事，可以节省很多时间去排版，达到事半功倍效果，但是昨晚在vue-cli项目里组件复用时发现基于Echarts图表的组件不能够复用，昨晚捯饬了很久，终于还是解决了这个问题，在此记录，加深自己理解。　　

具体来说，问题如下：开发了一个基于Echarts的图表组件，现在我想在一个界面内多次使用这个组件，但是我发现Echarts是通过找id来创建canvas的，这样调用同一个基于Echarts的组件时，这个id就会重复，导致第二个图表不能显示出来。如下图所示，按理说左下方应该也有左上方所示的基于Echarts的图表组件，但是并没有加载出来。

参考核心代码：

参考结果：

解决办法(昨晚捯饬了好久才思索到这个方法)：具体来说