CODEWITHSUNDEEP
blazor
Arve Hansen
Arve Hansen

Reputation: 1008

Is there a "OnParameterChanged" event in Blazor?

When a parameter in my Blazor component is changed, I want to do some stuff. If it's not too much, I could do it in the setter. However, if I want to do something more, maybe in a background thread, I can't (shouldn't) do it in the setter.

I know about OnParameterSetAsync, but how do I know what parameter was set? I can get it to work (see below), but was wondering if there is a better way?

Here is my component:

// ReactOnParameterUpdate.razor
<h2>@Message</h2>

@code
{
    [Parameter]
    public string Input { get; set; }

    protected string Message = "";
    private string _previousInput = null;

    protected override async Task OnParametersSetAsync()
    {
        if (_previousInput != Input)
        {
            _previousInput = Input;
            await SomeAsyncMethod();
        }
    }

    private async Task SomeAsyncMethod()
    {
        Message = $"Async method was called at {DateTime.Now}";
        await Task.CompletedTask;
    }
}

And the component is used here:

// Index.razor
@page "/"

<div class="input-group mb-3">
    <div class="input-group-prepend">
        <span class="input-group-text">Input:</span>
    </div>
    <input type="text" class="form-control" @bind="@Input">
</div>

<ReactOnParameterUpdate Input=@Input></ReactOnParameterUpdate>

@code
{
    protected string Input;
}

EDITED: From suggestions below and for completeness, here is how you can use SetParametersAsync:

    public override async Task SetParametersAsync(ParameterView parameters)
    {
        foreach (var param in parameters)
        {
            if (param.Name == nameof(Input) && (string)param.Value != Input)
            {
                await SomeAsyncMethod();
            }
        }
        await base.SetParametersAsync(parameters);
    }

Upvotes: 1

Views: 3727

Answers (2)

Peter Morris
Peter Morris

Reputation: 23224

SetParametersAsync is what you need. You can do this

string previousInput = Input;
await SetParametersAsync(parameters);
if (Input != previousInput)
{
}

Upvotes: 0

Zsolt Bendes
Zsolt Bendes

Reputation: 2569

You can use a loop to see what properties have been changed. Hope this helps.

@code {

    [Parameter]
    public Foo Foo { get; set; }

    public override async Task SetParametersAsync(ParameterView parameters)
    {
        foreach(var prm in parameters)
        {
            Console.WriteLine($"Name: {prm.Name}");
            Console.WriteLine($"Value: {prm.Value?.ToString()}");
        }

        await base.SetParametersAsync(parameters);
    }
}

Upvotes: 4

Related Questions