react-apexcharts中'type'属性/配置项的使用场景及混合类型图表实现疑问

嘿，我来帮你理清楚react-apexcharts里这几个type设置的区别和混合类型图表的实现方式哈！

首先拆解下这三个type的使用场景和优先级顺序：

• Chart组件的type prop：这是react-apexcharts v1.5版本新增的必填项，它其实只是给图表一个基础默认类型，作用就是避免报错，并不会强制所有系列都用这个类型。你随便填一个合法的类型（比如'bar'或者'line'）就行，完全不用和实际的系列类型一致。
• chart配置项里的chart.type：这个是ApexCharts核心的全局配置，适合所有系列都是同一种类型的场景，用来一次性统一设置所有系列的类型，但它的优先级低于单个系列的type设置。
• series数组中每个对象的type：这是优先级最高的设置！专门用来给单个系列指定专属类型，也是实现混合类型图表的关键所在。

针对你最关心的混合类型多系列图表问题，解决方案超简单：
你只需要在Chart组件的prop里传任意一个合法的type值（比如type='bar'）满足必填要求，然后在每个series对象里单独设置你需要的类型就行。举个实际的代码例子：

<Chart
  type='bar' // 这里只是必填的兜底值，随便填一个合法类型就好
  options={{
    chart: {
      // 这里可以不用设置type，就算设置了也会被series里的配置覆盖
    }
  }}
  series={[
    {
      name: '销量数据',
      type: 'bar',
      data: [300, 450, 380, 520, 490]
    },
    {
      name: '增长率',
      type: 'line',
      data: [12, 8, 15, 5, 10]
    }
  ]}
/>

这样渲染出来的图表，第一个系列会是柱状图，第二个系列会是折线图，完全不受组件prop里那个type的影响。

最后再明确下覆盖顺序：单个series的type > chart配置的type > Chart组件prop的type，只要你给系列单独指定了type，就会完全覆盖全局的设置，组件prop的type只是个必填的兜底项而已，不用纠结它的具体值。

备注：内容来源于stack exchange，提问作者André Kreienbring