首页 > 解决方案 > 仅更改所选 div 的类

问题描述

我希望它只更改 clicked 的类div。目前它将更改所有divs 的类。我已将其编写为 Blazor 组件。

@for (int i = 0; i < 5; i++)
{
    <div class="@divClass" @onclick="_ => ChangeDivClass()">@i</div>
}

@code 
{    
    String divClass;

    private void ChangeDivClass()
    {
        if (divClass == "red")
        {
            divClass = String.Empty;
        }
        else
        {
            divClass = "red";
        }
    }
}

标签: c#blazorblazor-server-sideasp.net-blazor

解决方案


您可以使用数组而不是一个变量。

@for (int i = 0; i < divClass.Length; i++)
 {
   var index = i;
   <div class="@divClass[i]" @onclick="_ => ChangeDivClass(index)">@i</div>
 }

@code 
 {    
   string[] divClass= new string[5];

   private void ChangeDivClass(int i)
    {
     if (divClass[i] == "red")
      {
        divClass[i] = String.Empty;
      }
     else
      {
        divClass[i] = "red";
      }
  }
}

推荐阅读