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!

Javascript html
Mar.09,2021 
mounted: function () {
  this.$nextTick(function () {
   //echarts
  })
}

Previous: Cannot add less to react, solution using webpack

Next: How webpack ignores import statements

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
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-1b303d0-2bcdf.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-1b303d0-2bcdf.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?