Live Chat Icon For mobile
Live Chat Icon

How do I conditionally change the CSS class names for a Blazor element?

Platform: Blazor| Category: Data binding

You have to use the binding in a ternary operator to achieve this.

<div class="menu @(IsOpen ? "open" : "")"></div>

<button @onclick="@AddClass">Add Class</button>
@code {

    private bool IsOpen { get; set; } = false;

    private void AddClass()
    {
        IsOpen = !IsOpen;
    }
}

Share with

Share on twitter
Share on facebook
Share on linkedin

Related FAQs

Couldn't find the FAQs you're looking for?

Please submit your question and answer.