如何用Echarts实现点击列表联动动态更新饼图数据？

本文共计936个文字，预计阅读时间需要4分钟。

目录 + 简单易懂的Echarts案例，实现点击列表联动饼图 + 效果图 + 1. 首先我们写一个左侧列表 + StageLine + StageLine + 子组件 + StageItem + 2. 接下来我们写右侧的饼图 + 3. 在最外层父级，写一些方法，进行联动 + 联接

目录

• 简单易懂的Echars案例，实现点击列表联动饼图
• 效果图
• 1. 首先我们先写一个左侧列表 StageLine
• StageLine 子组件 StageItem
• 2.接下来我们写右侧饼图
• 3. 在最外层父级，写一些方法，进行联动操作。

简单易懂的Echars案例，实现点击列表联动饼图

• 安装 echarts-for-react
• 项目中引入 import ReactECharts from 'echarts-for-react';
• 开始写案例啦！！！

效果图

1. 首先我们先写一个左侧列表 StageLine

利用StageItem 将 data 中的数据遍历并展示。