在 Blazor 组件中显示条件内容的最佳方式是什么

Question

我不是一个 Web 开发人员，但我了解 .NET。我决定尝试制作一个网络应用程序，但我在如何处理呈现的内容方面有点挣扎。

示例是从系统中删除文件和文件夹的应用程序（请注意，您不应该从网络应用程序中执行此操作）

我有一个组件要加载到模态中。加载时会提示询问您是否要删除该文件夹。您可以确认或取消。如果您确认它完成了删除文件夹的过程，并且内容更改为一条消息“请稍候”，一旦完成，该消息将变为“嘿，它已完成”。

这种情况导致我的组件看起来像

if(initialState)
{
    ask for confirmation
}
else if(RemovingState)
{
    please wait while this is completed
}
else if(CompletedState)
{
    Hey its finished
}

这导致我的方法在开始时会翻转这个尴尬的标志

StartRemoveMethod()
{
    initialState = false;
    RemovingState = true;

    DoTheRemoval
}

这只是感觉很奇怪。我正在考虑添加一个额外的检查，这意味着我必须引入一个新标志和另一个 else if 部分。我只是想知道我是否完全错过了什么，或者这基本上是我应该做什么的想法？

Answer 1

Blazor 绝对是一种思维转变，尤其是如果您来自 WinForms 或类似软件。当试图弄清楚如何将事物分解成组件时，很容易导致分析瘫痪。关于您的具体示例，这似乎是一种非常合理的方法（尽管 switch 和 enum 方法会稍微整理一下）。

对于 Blazor 来说还处于早期阶段，因此还没有很多非常详细的示例。一个非常好的是 Blazor 团队的 Blazing Pizzas 教程：https://github.com/dotnet-presentations/blazor-workshop/。这将引导您构建一个完整的系统，并提供一些关于如何管理应用程序状态的非常有用的指导。

您可能还想查看一些介绍性 (Facebook) React 文章，这些文章描述了构建组件和状态管理。与旧的 WinForms 范例相比，这些概念更好地转移到 Blazor。还值得阅读一下 Flux/Redux 的概念，因为它们是解决基于组件的 UI 方法中出现的一些相当常见的状态问题的流行方法。