Vue component rendering failed

problem: I have written a chart component, which cannot be rendered in the parent component. However, after modifying the file in the hot load, it will be rendered. After refreshing, the browser console has not reported any errors, and html has rendered the html element of component. Here is my code:

.png
chart

.png

html.png
html rendering code, data rendering failed

but with static data in the subcomponents, the rendering is successful.

add:

later debugging found that in the created function, the data is obtained asynchronously, but the data passed into the subcomponent is empty, which is the initial value in data

.

I hope people who have encountered related problems can provide some solutions, thank you!

Mar.09,2021

mounted: function () {
  this.$nextTick(function () {
   //echarts
  })
}
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1bf2fbb-31e4e.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1bf2fbb-31e4e.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?