如何在Blazor服务器端访问父组件？

Question

我正在使用 Blazor 的服务器端。

这里有一个名为 Child 的子组件：

<div class="Child">
    <img @OnClick="ShowFullImage" src="/img/aaa.jpg"/>
</div>
@code{
   private void ShowFullImage(){}
}

这里是一个父组件：

<Child></Child>
<img id="FullImage"/>

子组件即将显示缩略图。当用户点击子组件中的缩略图(即img)时，完整的图片将在名为FullImage的父组件中的img中显示。

现在的问题是，虽然我可以在子组件中添加onclick函数，但我还不知道如何访问其父组件。

- Melon NG

---

我不太明白你想通过完整的图像实现什么，但我建议查看这篇博客在这里。 - LOL Jovem

如果你需要从父组件中获取特定的内容，可以将其作为参数通过子组件传递。除此之外，你的问题并不是很清楚。 - Jakotheshadows

@LOLJovem 谢谢。您提供的博客很有帮助。 - Melon NG

Answer 1

我认为你在寻找的是 EventCallback。

// Child
<div class="Child">
    <img @onclick="ShowFullImage" src="/img/aaa.jpg"/>
</div>

@code{
   [Parameter]
   public EventCallback ShowFullImage { get; set; }
}

// Parent
<Child ShowFullImage="@ShowFullImage" />

@code{
    public void ShowFullImage()
    {
        // do what you want
    }
}

- Vencovsky

---

还有一个问题。我需要将子组件中图像的src传输到父组件中。我该如何实现这一点？ - Melon NG

我在https://chrissainty.com/3-ways-to-communicate-between-components-in-blazor/找到了解决方案。 - Melon NG