reactjs - 如何在水平栏中制作下拉菜单

Question

图片 这是我当前的结果栏

但是我需要内容点击时折叠，内容类似下图

提前给一些图书馆或一些解决方案的链接，谢谢

资源

  <HorizontalBar
              data={{
                barPercentage: 0.8,

                labels: [
                  'Label1', //THIS ARR FOR ONLY FOR EXAMPLE 
                  'Label2',
                  'Label3',
                  'Label4',
                  'Label5',
                  'Label6',
                  'Label7',
                  'Label8'
                ],
                datasets: [{
                  legend: {
                    display: false
                  },
                  label: '',
                  data: [7305064, 7305064, 5294903, 1313290, 600300, 96571, 617650, -200000],
                  fill: false,
                  borderColor: "#18B9AB",
                  backgroundColor: '#7facf5',
                  hoverBackgroundColor: '#609af7',
                  barThickness: 20
                }]
              }}
              options={{
                tooltips: {
                  enabled: false
                },
                scales: {
                  yAxes: [{
                    ticks: {
                      beginAtZero: true
                    }
                  }]
                },
                plugins: {
                  datalabels: {
                    color: '#EFEFEF',
                  }
                }
              }}/>

标签： reactjsreact-chartjs