使用dataZoom的slider组件，会出现无法滑动的情况

[cpdiem]

[Zhuyi731]

能提供一下复现代码吗

[cpdiem]

会比较难复现。情况是这样的：刚开发完，我自己这边是运行正常的，同事那边却出现无法滑动；过一天，我这边也无法滑动；再过一天，我这边又可以滑动了。。。目前正常。。。有些无奈。。。 代码如下： 组件页：

引用组件：

import charts from '../echartsTest/charts.vue'

getMiniChartOptions({}).then(res => { this.chartOptions = res.data.chartOptions let temp = this.chartOptions[0]
this.$nextTick(function() { this.$refs.charts.init(temp); }) })

参数： [{ "title": { "text": "分公司结构增幅（单位：%）", "x": "center" }, "legend": { "data": ["一分局","集美","思明","湖里"], "top": "6%" }, "grid": { "top": "15%", "left": "1%", "right": "1%", "bottom": "10%", "containLabel": true }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "xAxis": { "type": "category", "data": ["1月","2月","3月","4月","5月","6月"] }, "series": [ { "name": "一分局", "type": "bar", "data": [7.2,19.4,-3.8,0.8,4.9,4.3], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "集美", "type": "bar", "data": [7.1,22.0,-3.1,0.7,4.2,4.7], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "思明", "type": "bar", "data": [3.4,25.3,-1.7,-1.0,0.3,0.1], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "湖里", "type": "bar", "data": [7.3,29.4,-4.0,0.3,1.7,1.9], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } }

], "dataZoom" : [ { "type": "slider", "show": "true", "start": "0", "end": "20", "xAxisIndex": [0], "filterMode":"none", "bottom":"0%" } ] }, { "title": { "text": "客服部结构增幅（单位：%）", "x": "center" }, "legend": { "data": ["海沧","集美","思明","湖里","同安","翔安"], "top": "6%" }, "grid": { "top": "19%", "left": "1%", "right": "1%", "bottom": "10%", "containLabel": true }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "xAxis": { "type": "category", "data": ["1月","2月","3月","4月","5月","6月"] }, "series": [ { "name": "海沧", "type": "bar", "data": [7.9,25.5,-4.3,0.4,4.0,4.1], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "集美", "type": "bar", "data": [6.6,20.0,-2.5,0.9,4.2,4.6], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "思明", "type": "bar", "data": [3.4,25.3,-1.7,-1.0,0.3,0.1], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "湖里", "type": "bar", "data": [7.3,29.4,-4.0,0.3,1.7,1.9], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "同安", "type": "bar", "data": [7.5,20.4,-3.8,1.0,5.5,4.8], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } } , { "name": "翔安", "type": "bar", "data": [6.9,18.2,-3.7,0.4,4.1,3.6], "itemStyle":{ "normal":{ "label": { "show": true, "position": "top" } } } }

], "dataZoom" : [ { "type": "slider", "show": "true", "start": "0", "end": "20", "xAxisIndex": [0], "filterMode":"none", "bottom":"0%" } ] }]

[cpdiem]

组件页代码，被吞，补充如下： `

无该项图表

    <view v-for="(item, index) in charts">
        <view style="width: 100%;height: 800rpx;margin-top: 50rpx;">
            <uni-ec-canvas class="uni-ec-canvas" :id="index" :ref="index" canvas-id="uni-ec-canvas" :ec="item" force-use-old-canvas="true"></uni-ec-canvas>
        </view>
    </view>
</view>`

`

`

[Zhuyi731]

组件页代码，被吞，补充如下： <view style="width: 95%;"> <view v-if="charts.length === 0" style="text-align: center;"> 无该项图表 </view> <view v-for="(item, index) in charts"> <view style="width: 100%;height: 800rpx;margin-top: 50rpx;"> <uni-ec-canvas class="uni-ec-canvas" :id="index" :ref="index" canvas-id="uni-ec-canvas" :ec="item" force-use-old-canvas="true"></uni-ec-canvas> </view> </view> </view>

` `

我试了下 似乎没有出现不能滑动的情况。😂

[Zhuyi731]

有用自定义的echart吗？自定义echart需要下载slider组件

[cpdiem]

有用自定义的echart吗？自定义echart需要下载slider组件

有自定义，也包含了dataZoom的组件。目前也没再出现无法滑动的情况了，都不知道当时怎么就不行了。。。