Echarts图表点击事件

开发过程中，我们经常会碰到这样的需求：在柱状图上，点击某条柱形，调用相应的方法去请求接口，获取当前点击图表项的数据

其中myChart是绘图对象，refbar是绘图的ref

在dom加载完成后绑定点击事件，图表子组件：

  mounted() {

    this.myChart = this.$echarts.init(this.$refs.refbar)
    this.myChart.on('click', params => {
      this.$emit('echartsId', params)
    })
  },

父组件接收

       <barChart :lt-obj="ltObj" @echartsId="echartsIdcli">
          <div slot="header" class="headre">
            <div class="headre-l">
              <div class="headre-lx" />
              <div class="headre-ln">接口调用</div>
            </div>
          </div>
        </barChart>
        
        
      /**
     * @description:点击的图块获取数据
     * @params {Object} item 该柱子下数据
     */
    echartsIdcli(item) {  
      if (this.id === item.data.id) { //避免不停的发送请求
        this.id = ''
        // this.currentSearchCat = '全部' 给参数赋值
      } else {
        this.id = item.data.id
        this.currentSearchCat = item.name//给参数赋值
      }