Question

当用户单击某个项目的编辑按钮时，该项目（具有ites属性）变为可编辑状态，我试图将项目（日志）列表显示为只读。但是我单击任何项目的编辑图标，只有最后一个变为可编辑。删除操作可以正常工作，并删除所需的项目。

                @{ int i = -1; }
                @foreach (var log in logs.OrderBy(p => p.Date))
                {
                    i++;
                <tr>
                    <td>@log.StaffId   @i</td>
                    <td>@log.StudyId</td>
                    @if (!isEditable[i])
                    {
                        <td>@log.Date.ToString("dd MMM")</td>
                        <td>@log.Hour</td>
                        <td>
                            <span class="oi oi-pencil" @onclick="(() => { isEditable[i] = true; })" />
                            <span class="oi oi-trash" @onclick="(() => Delete(log.Id))" />
                        </td>
                    }
                    else
                    {
                        <td><input type="date" @bind="@log.Date" /></td>
                        <td><input type="number" @bind="@log.Hour" /></td>
                        <td><span class="oi oi-cloud-upload" @onclick="(() => isEditable[i] = false)"/></td>

                    }
                </tr>
                }

上面的代码中的

isEditable是用于在编辑和只读之间切换的帮助器数组。它定义为

@code {

            bool[] isEditable;
protected async Task GetAll()
            {
                    logs = await Http.GetJsonAsync<List<Log>>($"api/Logs/{from.Ticks}/{to.Ticks}");
                    isEditable = new bool[logs.Count];
                    for (int i = 0; i < logs.Count; i++)
                    {
                        isEditable[i] = false;
                    }
                }

Answer 1

只需在每次迭代的循环内创建一个新的变量：

@foreach (var log in logs.OrderBy(p => p.Date))
{
   i++;
   var j=i; // use j from now
   ...
   @if (!isEditable[j]) // like this

这不是Blazor的问题，它与C＃有关。

Answer 2

您应该立即在foreach循环的开始处定义一个局部变量，并在其中分配i变量的值：

i++;
var local = i;

现在，在下面的代码中，将i替换为local修饰符。

See this post，我在此解释了原因...

如何在Blazor Client（剃刀组件）.Net Core中的列表项的读取和编辑模式之间切换

2 个答案: