收藏
回答

小程序 使用echarts 第一次进入渲染成功退回上一页再进入就不显示 点击就可以显示怎么解决?

  data: {
    ec: {
      lazyLoad: true
    },
}
  onLoad() {
    this.initChart();
  },


  onShow() {
    this.getStatisticsData();
  },
  initChart() {
    this.data.chartComponent = this.selectComponent('#mychart-dom-line');
    this.data.chartComponent.init((canvas: any, width: number, height: number, dpr: number) => {
      chart = echarts.init(canvas, null, {
        width,
        height,
        devicePixelRatio: dpr, // new
      });
      canvas.setChart(chart);
    });
  },

  getStatisticsData() {
    wx.showLoading({
      title: '加载中',
    });
    api
      .__request(api.apis.statistics.total, 'POST', {
        endDate: this.data.dateRange.end_date,
        startDate: this.data.dateRange.start_date,
        type: 'customer',
      })
      .then((res: any) => {
        this.setData({
          statisticsData: res.data,
        });
      });
    this.getTRend();
  },


  getTRend() {
    api.__request(api.apis.statistics.trend, 'POST', {
      endDate: this.data.dateRange.end_date,
      startDate: this.data.dateRange.start_date,
      type: this.data.dataType,
    })
      .then((res: any) => {
        const resData = res.data;
        const xAxis = resData.map((item: any) => formatMD(item.ds));
        const data = this.data.chartIndex != 3
          ? resData.map((item: any) => item.count)
          : resData.map((item: any) => item.percent);
        let title = '';
        this.data.chartIndex == 0 ? title = '客户总数趋势图' : '';
        this.data.chartIndex == 1 ? title = '新增客户数总趋势图' : '';
        this.data.chartIndex == 2 ? title = '车讯达客户数趋势图' : '';
        this.data.chartIndex == 3 ? title = '车讯达客户占比趋势图' : '';
        const option = getLineOption(title, xAxis, data);
        console.log(xAxis, data);
        this.setData({
          xAxis,
        });
        this.resetChart(option);
        wx.hideLoading();
      });
  },


  resetChart(option: any) {
    if (chart) {
      chart.clear();
      chart.setOption(option);
    } else {
      setTimeout(() => {
        this.resetChart(option);
      }, 200);
    }
  },

首次进入一定是渲染成功的 但是退出上一页再进入就不显示了 点击切换 重新执行getStatisticsData也会渲染出来 如果锁屏再开也会显示出来 有人碰到过一样的情况么 请问怎么解决

最后一次编辑于  2020-12-21
回答关注问题邀请回答
收藏

1 个回答

  • 张鑫
    张鑫
    2020-12-21

    已经解决了 目前是在异步拿到数据之后每次 重新 initChart 在initChart中setOption

      initChart(option: any) {
        this.data.chartComponent = this.selectComponent('#mychart-dom-line');
        this.data.chartComponent.init((canvas: any, width: number, height: number, dpr: number) => {
          chart = echarts.init(canvas, null, {
            width,
            height,
            devicePixelRatio: dpr, // new
          });
          canvas.setChart(chart);
          chart.setOption(option);
        });
      },
    
    
    
    2020-12-21
    有用
    回复
登录 后发表内容
问题标签