您可以编写一个自定义插件，如answer所示，但您需要在图例框的宽度上添加一些额外的间距，而不是在高度上添加一些额外的间距：
第一个

@LeeLenalee建议的answer对我来说很有效。但是对于那些感到困惑并希望将其集成到组件中的人来说，我所做的是：

<div className="dougnut-chart-container">
                <Doughnut
                    className="doughnut-chart" 
                    data={
                        {
                            labels: ["label_1", "label_2", "label_3", "label_4", "label_5", "label_6"],
                            datasets: [
                                {
                                    label: "Title",
                                    data: [12821, 34581, 21587, 38452, 34831, 48312],
                                    backgroundColor: [
                                        'rgb(61, 85, 69)',
                                        'rgb(115, 71, 71)',
                                        'rgb(166, 178, 174)',
                                        'rgb(209, 191, 169)',
                                        'rgb(66, 63, 62)',
                                        'rgb(43, 43, 43)',

                                    ]
                                }
                            ],
                        }
                    }
                    options={
                        {
                            plugins: {
                                legend: {
                                    labels: {
                                        color: "white",
                                        font: {
                                            size: 12
                                        },
                                        padding: 10,
                                    },
                                    title: {
                                        display: true,
                                        text: "A Longer Title To Occupy Space",
                                        color: "grey",
                                        padding: {
                                            bottom: 10
                                        },
                                        font: {
                                            size: 13
                                        }
                                    },
                                    position: "left"

                                },
                                // this is the id that is specified below
                                legendDistance: {
                                    padding: 130 // dictates the space
                                }
                            },
                            elements: {
                                arc: {
                                    borderWidth: 0
                                }
                            },
                            responsive: true,
                            maintainAspectRatio: true,

                        }
                    }
                    plugins={
                        [
                            {
                                id: 'legendDistance',
                                beforeInit(chart, args, opts) {
                                    // Get reference to the original fit function
                                    const originalFit = chart.legend.fit;
                                    // Override the fit function
                                    chart.legend.fit = function fit() {
                                        // Call original function and bind scope in order to use `this` correctly inside it
                                        originalFit.bind(chart.legend)();
                                        // Specify what you want to change, whether the height or width
                                        this.width += opts.padding || 0;
                                    }
                                }
                            }
                        ]
                    }
                />

            </div>

这就是结果：result

**请注意：**您需要重新加载页面才能看到更改。

你可以试试这个代码-〉

const legendMargin = {
  id: "legendMargin",
  beforeInit: function (chart) {
    const fitValue = chart.legend.fit;
    chart.legend.fit = function fit() {
      fitValue.bind(chart.legend)();
      return (this.height += 40);
    };
  }
};

那么只需要像这样传递legendMargin作为一个道具
<Bar options={options} data={data} plugins={[legendMargin]} />个