Echarts使用了watch监听后数据重复超出怎么解决
```javascript
data() {
return {
chart: null,
}
},
watch: {
monthStrList: {
handler(val) {
this.setOptions(val)
}
},
monthStrList2: {
handler(val) {
this.setOptions(val)
},
},
},
mounted() {
this.$nextTick(() => {
this.initCharts()
})
},
beforeDestroy() {
if (!this.chart) {
return
}
this.chart.dispose()
this.chart = null
},
methods: {
initCharts() {
this.chart = echarts.init(this.$refs.stripChart)
this.chart.clear();
this.setOptions(this.chartData)
},
setOptions() {
this.chart.setOption({
legend: {
show: this.show,
data: [this.name, this.name2],
icon: 'rect',
itemWidth: 20,
itemHeight: 10,
itemGap: 10,
left: '14%',
top: '2%',
textStyle: {
fontSize: 12,
color: ['#FF9435', '#899dbf']
},
},
tooltip: {
// show: true, // 显示图例的tooltip
// trigger: 'axis',
// axisPointer: {
// type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow'
// }
},
grid: {
top: '8%',
left: '2%',
right: '2%',
bottom: '10%',
containLabel: true
},
xAxis: {
type: 'value',
splitLine: {show: false},//坐标轴在 grid 区域中的分隔线
// axisLabel: {show: false},//坐标轴刻度标签
axisTick: {show: false},//坐标轴刻度
axisLine: {show: false},//坐标轴轴线
},
yAxis: {
type: 'category',
axisTick: {show: false},
axisLine: {show: false},
axisLabel :{
interval:0,
},
data: this.monthData,
// data: [
// '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'
// ],
inverse: true,
max: 5
},
series: [{
name: this.name,
type: 'bar',
stack: 'total',
color: this.color,
label: {
show: this.show,
},
emphasis: {
focus: 'series'
},
data: this.monthStrList,
// data: [20, 32, 18, 34, 30, 33]
},
{
name: this.name2,
type: 'bar',
stack: 'total',
color: this.color2,
label: {
show: this.show,
},
emphasis: {
focus: 'series'
},
data: this.monthStrList2,
// data: [12, 13, 10, 34, 9, 30]
},
],
animationDuration: 0,
animationDurationUpdate: 500,
animationEasing: 'linear',
animationEasingUpdate: 'linear'
})
}
}
你的需求是什么,想要他们不重叠显示吗,还是啥