Problem description :
In the project, the el-dialog component is used to display the content. The content is a component encapsulated by itself. The component obtains the dom element through ref and then draws the echarts graphics.
The problem is : after the el-dialog component pops up, the echarts graphics are not rendered. At first, I thought that there was a problem with the monitoring data. By putting the component outside the el-dialog pop-up window component, I found that the graphics can be displayed normally, so I locked the cause of the problem on the el-dialog component. Through Baidu, I learned that when the pop-up window did not pop up at the beginning, the components in the el-dialog were not rendered, so when using ref to get the dom element, get it before the el-dialog is not rendered is not available.
I went to read the document again and found a small tip:
Then put the code in the opend event callback, and the echarts graphics can be displayed normally in the el-dialog.
Renderings:
