第一个问题：

代码如下

<el-button @click="tubiao">切换图表</el-button> <div id="chart1" v-if="+abc === 1"></div> <div id="chart2" v-if="+abc === 2"></div> <div id="chart3" v-if="+abc === 3"></div> abc: '1', tubiao() { if (!this.abc) { this.abc = 1 } else if (+this.abc === 1) { this.abc = 2 } else if (+this.abc === 2) { this.abc = 3 } else { this.abc = 1 } }

此时点击按钮，div会进行切换，但是echarts不会去进行渲染这个盒子内的图表，所以页面是空白的。 解决办法：使用v-show就可以了

第二个问题：

代码如下：

<div id="chart1"></div> <div id="chart2"></div> <div id="chart3"></div> mounted() { this.pie('chart3') this.bar('chart2') this.line('chart1') },

在mounted里这样写的话会出现#chart1被渲染的是柱状图。 解决办法：按顺序先渲染#chart1

mounted() { this.line('chart1') this.bar('chart2') this.pie('chart3') },