echarts使用双grid报错Cannot read property ‘type‘ of undefined和xAxis and yAxis must use the same grid

需求：上下两个统计图，使用不同的y轴，相同的x轴
echarts使用双grid时

          grid: [
            {
              left: '0%',
              right: '0%',
              height: '50%',
            },
            {
              left: '0%',
              right: '0%',
              top: '50%',
              height: '50%'
            }
          ],

报错：TypeError: Cannot read property ‘type’ of undefined

报错原因引入的echarts cdn资源有错，之前一直使用的min版本，min这是压缩版，改成使用完整版可以解决

<!-- <script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.0.2/echarts.min.js"></script> -->
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.0.2/echarts.js"></script>

之后报错：Error: xAxis and yAxis must use the same grid
原因是把第二个统计图关联的是第一个x轴

          series: [
            {
              name: '价格(USD)',
              type: 'line',
              smooth: true,
              data: this.data1
            },
            {
              name: '成交额(USD)',
              type: 'bar',
              smooth: true,
              xAxisIndex: 0,
              yAxisIndex: 1,
              data: this.data2
            }
          ]

解决方法：

          series: [
            {
              name: '价格(USD)',
              type: 'line',
              smooth: true,
              data: this.data1
            },
            {
              name: '成交额(USD)',
              type: 'bar',
              smooth: true,
              xAxisIndex: 1,
              yAxisIndex: 1,
              data: this.data2
            }
          ],
          // 坐标轴指示器
          axisPointer: {
            // 线条指示器
            link: {
              // 属性为all，所有统计图共用一个x轴
              xAxisIndex: 'all'
            }
          },

全部代码：

	chart() {
      var chart = this.$refs.chart
      if (chart) {
        let myChart = echarts.init(chart)
        let option = {
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'cross'
            }
          },
          legend: {
            data: ['价格(USD)', '成交额(USD)']
          },
          // 坐标轴指示器
          axisPointer: {
            // 线条指示器
            link: {
              // 属性为all，所有统计图共用一个x轴
              xAxisIndex: 'all'
            }
          },
          // 定位
          grid: [
            {
              left: '5%',
              right: '5%',
              height: '35%'
            },
            {
              left: '5%',
              right: '5%',
              top: '55%',
              height: '35%'
            }
          ],
          xAxis: [
            {
              //隐藏了x轴
              show: false, 
              type: 'category',
              boundaryGap: true,
              // x轴坐标两个是否留白
              // boundaryGap: false,
              // x轴坐标值
              data: this.xData,
              axisLine: {
                onZero: true
              }
            },
            {
              gridIndex: 1,
              type: 'category',
              boundaryGap: true,
              // x轴坐标两个是否留白
              // boundaryGap: false,
              // x轴坐标值
              data: this.xData,
              axisLine: {
                onZero: true
              }
            }
          ],
          yAxis: [
            {
              type: 'value',
              name: 'USDT价格',
              axisLabel: {
                // y轴添加单位
                formatter: '{value}'
              }
            },
            {
              gridIndex: 1,
              type: 'value',
              name: '成交额',
              axisLabel: {
                // y轴添加单位
                formatter: '{value}亿'
              }
            }
          ],
          series: [
            {
              name: '价格(USD)',
              type: 'line',
              smooth: true,
              data: this.data1
            },
            {
              name: '成交额(USD)',
              type: 'bar',
              smooth: true,
              xAxisIndex: 1,
              yAxisIndex: 1,
              data: this.data2
            }
          ]
        }
        myChart.setOption(option)
      } else console.log('空')
    }

最终实现效果：