1. The carousel display shows more than one echarts graph, so the container for drawing echarts should be dynamically set;
<div v-for="(item,index) in list" :key="item.id">
<div :id="'ec'+index"></div>
</div
When initializing the echarts graph, a step of judgment is added to prevent warnings from appearing in the console
initEcharts(index){
const option={...};
let myChart = echarts.getInstanceByDom(document.getElementById('ec'+index));
if(myChart==null){
myChart = echarts.init(document.getElementById('ec'+index));
}
myChart.setOption(option);
// 随屏幕大小调节图表
window.addEventListener("resize", () => {
myChart.resize();
});
}
// 设置走马灯占满div
.right-content ::v-deep .el-carousel--horizontal {
height: 100%;
}
.right-content ::v-deep .el-carousel__container {
height: 100%;
}
// 隐藏走马灯底部按钮
.right-content ::v-deep .el-carousel__indicators--horizontal {
display: none;
}
// 隐藏走马灯左右切换按钮
.right-content ::v-deep .el-carousel__arrow--left,
.right-content ::v-deep .el-carousel__arrow--right {
display: none;
}