vue 父组件有点击按钮点击后 向 子组件 传值 子组件的echart变化

在父组件中，需要在按钮的点击事件中调用子组件的方法，并传入需要改变的数据。可以使用ref属性获取子组件的实例，然后调用子组件的方法。

例如：

<template>
  <div>
    <button @click="changeData">改变子组件数据</button>
    <child-component ref="child"></child-component>
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue'

export default {
  components: {
    ChildComponent
  },
  methods: {
    changeData() {
      const child = this.$refs.child
      child.changeEchartData(data) // 调用子组件的方法，传入需要改变的数据
    }
  }
}
</script>

在子组件中，可以在方法中接收父组件传来的数据，并更新echart的数据。可以使用echarts的setOption()方法来更新echart的数据。

例如：

<template>
  <div ref="echart"></div>
</template>

<script>
import echarts from 'echarts'

export default {
  data() {
    return {
      echartData: {
        // echarts的数据
      }
    }
  },
  mounted() {
    this.initEchart()
  },
  methods: {
    initEchart() {
      const echartDom = this.$refs.echart
      this.echart = echarts.init(echartDom)
      this.echart.setOption(this.echartData)
    },
    changeEchartData(data) {
      // 更新echart的数据
      this.echartData = data
      this.echart.setOption(this.echartData)
    }
  }
}
</script>
``