问题:请求到后台数据 echarts组件没有更新
    解决方案:
    每次更新后台数据的时候需要监听数据的变化,这样才可以让echarts重新渲染数据。

    1. 方式一:
    2. getUserNumberData() {
    3. userNumData().then(res=>{
    4. //let userNumberObj = { ...this.userNumberData };
    5. //日期
    6. this.userNumberData.xAxis[0].data = res.value.currentDay;
    7. //注册用户
    8. this.userNumberData.series[0].data = res.value.newUserCount;
    9. //日活跃量
    10. this.userNumberData.series[1].data = res.value.dayActiveCount;
    11. //重新赋值
    12. this.userNumberData = JSON.parse(JSON.stringify(this.userNumberData));
    13. })
    14. }
    15. 方式二:
    16. getUserNumberData() {
    17. userNumData().then(res=>{
    18. let userNumberObj = { ...this.userNumberData };
    19. //日期
    20. userNumberObj.xAxis[0].data = res.value.currentDay;
    21. //注册用户
    22. userNumberObj.series[0].data = res.value.newUserCount;
    23. //日活跃量
    24. userNumberObj.series[1].data = res.value.dayActiveCount;
    25. //重新赋值
    26. this.userNumberData = userNumberObj;
    27. })
    28. }

    知识点:

    1. JSON.parse()
    2. JSON.stringify()
    3. 扩展运算符

    参考文章:

    1. vue+Echarts动态数据已经赋值,但是无法渲染页面的问题