vue外部按钮调用 echarts饼形图的高亮

最终效果：

1.首先点击右侧切换的之后，利用refs更改Echarts.vue组件的data值

    //更改待办事宜
    tabCon() { 
      this.$refs.Echarts.dataIndex = 0 
    },
    tabCon2() { 
      this.$refs.Echarts.dataIndex = 1 
    },

 2.Echarts.vue监听data的dataIndex值，如果被修改执行事件

    watch: {
        dataIndex: {
            handler(newValue) {
                // console.log('dataIndex被修改了', newValue)
                this.autoAct()
            }
        }
    },

3.autoAct事件用来修改高亮

        autoAct() {
            this.chart = echarts.init(this.$el, 'macarons')
            //取消之前高亮的图形
            this.chart.dispatchAction({
                type: 'downplay',
                seriesIndex: 0,
                dataIndex: this.dataIndex == 0 ? 1 : 0
            });
            // 高亮当前图形
            this.chart.dispatchAction({
                type: 'highlight',
                seriesIndex: 0,
                dataIndex: this.dataIndex
            })
        },