问题:
跳转到别tabbars页面之后,再回来,echarts图显示缩小小团子。
原因分析:
在tabs切换中有echarts的话,我们会发现初始化的那个echarts是有宽度的,当点击tabs切换之后,切换过来的echarts只剩下100px的宽度。
 这是因为渲染的时机不对,我们需要在点击到当前切换的时候在echarts父级加载完毕之后在执行echarts,而不是在页面初始化的时候就把所有tabs里面的echarts都执行。
 因为echarts会根据父级给宽度,而在初始化页面的时候其他tabs切换是display:none;没有宽度,所以会发生以上问题。
解决:
tabbars跳转后,将echarts删除,跳转回来之后,再重新绘制。使用v-if解决
增加: v-if="chart"
tabbars点击事件:onTabItemTap,点击回来时,将chart:true,
页面离开时,onHide: 将chart=false
<view class="seven">
      <view class="chart-title">近7天洗涤费趋势</view>
      <view class="charts-box" v-if="chart">
        <qiun-data-charts
            type="column"
            :eopts="eopts"
            :chartData="chartData"
            :echartsH5="true"
            :resize="echartsResize"
            padding="0"
            margin="0"/>
      </view>
    </view>
//..
data(){
return {
 chart: false,
}
}
  onHide() {
    console.log(">>页面不见了")
    this.chart = false;
  },
  onShow() {
    console.log(">>>2. onShow,tabs每次跳转触发 ")
    this.chart = true
  },
  methods: {
    onTabItemTap(item) {
      console.log(">>|------------点击事件", item)
    },
}



















