element dialog里的echart

对话框内写有echart图表,页面首次加载后,点开对话框不能显示图表,关联的ref拿不到。网上百度了很多都是使用this.$nextTick,但是我首次就是有问题,我把图表加载的代码写在mounted里,试了各位位置都使用this.$nextTick还是没用,首次加载还是有问题


我刚测试了,不放在dialog也是一样的


        mounted() {

            this.changValue = this.changValue + 1;
            //this.$nextTick(() => {
                let myChart = echarts.init(this.$refs.abc);

                let option = {
                    tooltip: {
                        trigger: 'item',
                        formatter: '{a} <br/>{b} : {c} ({d}%)'
                    },
                    legend: {
                        bottom: 10,
                        left: 'center',
                        data: ['已出租', '未出租', '已预约']
                    },
                    series: [{
                        name: '车辆出租状态',
                        type: 'pie',
                        radius: '55%',
                        center: ['50%', '40%'],
                        data: [{
                                value: 11,
                                name: '已出租'
                            },
                            {
                                value: 22,
                                name: '未出租'
                            },
                            {
                                value: 33,
                                name: '已预约'
                            }
                        ],
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }]
                };
                myChart.setOption(option);
            //});
        },
阅读 1.3k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题