仅更改所选div的类 [英] Change class for selected div only

问题描述

我希望它仅更改单击的div的类.当前它将更改所有div的类.我已将其编写为Blazor组件.

I would like it to only change the class for the clicked div. Currently it will change the class for all divs. I have written this as a Blazor component.

@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";
        }
    }
}

推荐答案

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

You can use an array instead of one variable.

@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";
      }
  }
}

这篇关于仅更改所选div的类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！