I've seen examples of how to call a child component's method from a parent component using the `@ref` attribute, but when I try to use it with a `foreach` loop, only the last rendered component's method gets called and not all of them. Below are examples of my components.

**Parent component:**

```
<button type="button" class="btn btn-link" @onclick="BtnSyncAll_Click">Run<button>

@foreach(var site in Sites)
{
    <Site @ref="SiteView" @Code="@site"></Site>
}

@code {
    protected Site SiteView;
    protected List<string> Sites { get; set; } = new List<string>
    {
        "A00001",
        "A00002"
    };

    protected async Task BtnSyncAll_Click()
    {
        await SiteView.Sync();
    }
}

```

**Child component (Site.razor):**

```
<div>
    <p>@Code>/p>
</div>

@code {
    [Parameter]
    public string Code { get; set; }

    protected async Task Sync()
    {
        await ...
    }
}

```