Blazor WebAssembly：带有 if 条件的嵌套 Foreach 生成重复的 html 内容

Question

我正在创建一个页面，向用户显示社团列表，并允许用户单击该社团以查看该社团举办的活动列表。这个问题是，当每个事件只应出现一个列表时，社会容器中的每个事件都会出现多个重复项。

@foreach (Data.SocietyBarModel soc in PopulateSocList())
        {
            <button id="society-button" class="border-0 p-0 my-2 bg-white rounded-3 d-lg-flex flex-row justify-content-between p-1 text-center" @onclick="() => ExpandWidget(soc.Id)">
                <div id="society-bar" class=" my-2 bg-white rounded-3 d-lg-flex flex-row justify-content-between p-1 text-center">
                    <div class="w-25 p-2 m-0 d-flex align-items-center justify-content-center flex-nowrap">
                        <img id="profile-img" src="@soc.Photo" />
                    </div>
                    <div style="margin-right: 12.5%;" class="d-inline-block align-items-center justify-content-center text-center w-50 text-truncate">
                        <h2 class="m-0 p-2 w-100 text-wrap" style="word-break: break-word;">@soc.UserName</h2>

                        <p class="m-0 p-2 w-100 text-wrap" style="word-break: break-word;">@soc.Bio</p>
                        @if (expandedWidget == soc.Id)
                        {
                            <h2>Events:</h2>

                            @foreach (Data.EventDataModel eD in GetSocietyEvents(soc.Id))
                            {
                                <div id="society-event-box">
                                    <h3>@eD.Name</h3>
                                    <p class="fw-bold">@eD.Date</p>
                                    <p>@eD.Description</p>
                                </div>
                            }
                        }

                    </div>
                </div>
            </button>
        }

PopulateSocList() 从数据库中检索社团列表，GetSocietyEvents() 从数据库中检索该社团拥有的事件列表。

    private List<Data.SocietyBarModel> PopulateSocList()
    {

        Data.MySQLDB db = new Data.MySQLDB();
        List<Data.SocietyBarModel> sB = db.GetAllSocieties();
        return sB;
    }

    private List<Data.EventDataModel> GetSocietyEvents(int socId)
    {
        Data.MySQLDB db = new Data.MySQLDB();
        return db.GetSocietyEvents(socId);
    }

我不确定要尝试什么。我尝试使用 while 循环代替 if 语句，它根本不产生任何事件。我还尝试使用一个布尔变量，该变量在嵌套的 foreach 语句之后变为 false，这是包含嵌套的 foreach 语句的 if 语句的条件。

更新：更多细节

• 数据库本身没有保存重复数据是程序的问题
• db.GetSocietyEvents函数使用for循环将数据的各部分列添加到列表中，并使用mysqldata reader的字段计数作为上限
• ExpandWidget() 函数用作将 expandedWidget 变量设置为 soc.Id 或 0.