用@ref无法捕获StackedArea组件的引用

[C-Li]

我按照堆积面积图的示例代码编写了以下内容：

@using AntDesign.Charts
@using Title = AntDesign.Charts.Title
@using BlazorApp.Data
@inject MyService Service;

<StackedArea @ref="chart1" TItem="object" Config="config" />

@code{
    IChartComponent chart1;
    IChartComponent chart2;

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();
        var records = await Service.GetRecordsAsync();
        List<object> chartData = new List<object>();
        foreach (var item in records)
        {
            chartData.Add(new { date = item.RecordTime.ToString("yyyy/MM/dd"), type = "a", value = item.a});
            chartData.Add(new { date = item.RecordTime.ToString("yyyy/MM/dd"), type = "b", value = item.b});
            chartData.Add(new { date = item.RecordTime.ToString("yyyy/MM/dd"), type = "c", value = item.c> 0 ? item.c: 0 });
        }
        await chart1.ChangeData(chartData.ToArray());
    }

    readonly StackedAreaConfig config = new StackedAreaConfig
    {
        Title = new Title
        {
            Visible = true,
            Text = "余额"
        },
        Description = new Description
        {
            Visible = false,
            Text = "当label类型设置为line时，label与面积区域尾端顶部对齐。"
        },
        XField = "date",
        YField = "value",
        StackField = "type",
        Color = new[] { "#6897a7", "#8bc0d6", "#60d7a7", "#dedede", "#fedca9", "#fab36f", "#d96d6f" },
        XAxis = new ValueCatTimeAxis
        {
            Type = "dateTime",
            TickCount = 5
        },
        Label = new StackedAreaLabel
        {
            Visible = true,
            Type = "line",
        },
        Legend = new Legend
        {
            Visible = false,
        }
    };
}

但是执行到await chart1.ChangeData(chartData.ToArray());这行的时候会报错

System.NullReferenceException:“Object reference not set to an instance of an object.”

<>4__this.chart1 是 null。

不知道问题出在哪里