Blazor Web Assembly Components 更新广告自定义对象传递答案

【问题标题】：Blazor Web Assembly Components update ad custom object passingBlazor Web Assembly Components 更新广告自定义对象传递
【发布时间】：2021-06-02 08:02:50
【问题描述】：

请考虑这种情况：

我有一页包含 三个组成部分：

输入组件
活动列表组件
摘要组件

第一个组件包括一个将 URL 作为输入的表单。

当表单被提交时，应用程序从这个 URL(JSON) 中获取内容并创建一个列表。

第二个组件应该显示此自定义对象的结果，该对象在表单中包含一个列表，其中每个项目都有一个复选框，允许用户取消选择不需要的项目。

当用户准备好并点击提交时，我会解析结果并生成一个输出文件。

第三个组件生成结果摘要。

我正在努力了解如何更改 ActivityListComponent 的可见性，并在用户单击提交时从代码中传递一个自定义对象。

基本问题是：

如何控制组件的可见性以及传入自定义对象？

【问题讨论】：

您使用参数将对象传递给组件。就控制组件的可见性而言，您有多种选择。您可以使用代码有条件地编写带有“显示：无”的样式属性；或者您可以将组件包装在 @if() {} 块中。这完全取决于您要达到的效果。我的建议是更多地了解 Blazor，然后看看您是否可以提出更具体的问题，展示您尝试过的代码并解释您面临的挑战。

标签： c# .net blazor blazor-webassembly blazor-client-side

【解决方案1】：

最后我使用了 Blazor 事件。

// Child Object
public List<Cat> Cats { get; set; }
[Parameter] public EventCallback<List<Cat>> NewCatList { get; set; }

// Somewhere in the code I trigger the event
await NewCatList.InvokeAsync();

// Parent Object 
<InputFormComponent NewCatList="@Method" />

@Code {
    public void Method(List<Cat> Cats)
    {
        // Some code
    }
}

这是一个更大的问题，因为我在子组件中使用 @bind-value 而不是 @bind-Value，并且错误没有被拾取或正确处理。

我花了一点时间才弄明白。

虽然吸取了很多教训 :)

【讨论】：