Set animation class in blazor doesnt work.

Animations don't work if I set them as variables, see example. If I set them with JavaScript Interop, they work. Can someone explain why this happens?

    private async Task SetTransitionStateAsync(TransitionState state, int animationDelay)
    {
        string translationPrefix = $"transition-opacity ease-linear duration-{animationDelay}"; 
        
        CurrentState = state;        
        switch (CurrentState)
        {
            case TransitionState.Hidden:
                TransitionClass = string.Empty;
                IsVisible = false;
                break;
            case TransitionState.Open:
                TransitionClass = string.Empty;
                break;
            case TransitionState.EnteringStart:
                TransitionClass = $"{translationPrefix} -translate-x-full";
                IsVisible = true;
                break;
            case TransitionState.EnteringEnd:
                TransitionClass = $"{translationPrefix} translate-x-0";
                break;
            case TransitionState.LeavingStart:
                TransitionClass = $"{translationPrefix} translate-x-0";
                break;
            case TransitionState.LeavingEnd:
                TransitionClass = $"{translationPrefix} -translate-x-full";
                break;
        }
        
        await InvokeAsync(StateHasChanged);
  }
Was this page helpful?