Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

onParametersSetAsync is being called even though params has not been changed

I'm trying to figure out how Blazor behaves. I'm debugging something by temporarily removing commenting out other code so as not to be destructed and make sure with what I am observing. The code looks like this.

<OneComponent @ref="_oneComponent" param1="@varParam1" param2="@varParam2"></OneComponent>
@code {
  private OneComponent _oneComponent; 
  private _objectOne varParam1;   // There are values here.
  private _objectTwo varParam2;   // There are values here as well.

  private async Task SaveClicked()
  {
    if (_oneComponent.OnSaveClicked())
    {
      // nothing here.
    }
  }
}

When I run the program, I noticed OnParametersSetAsync() of <OneComponent/> is being re-run. My question is, why is OnParametersSetAsync() being re-run again even though I didn't change any of varParam1 or varParam2? Is that what it is? Should it re-run when the program now points to that component after the _oneComponent returns true or false?

like image 881
user3856437 Avatar asked Dec 06 '25 20:12

user3856437


2 Answers

Whether OnParametersSet() or OnParametersSetAsync() are called depends on the type of the parameters of the component.

For primitive types and also for a couple of additional types that are known to be immutable, Blazor can easily detect if the values of the parameters changed or not, and decide to call or not call the OnParametersSet() method.

So, if your parameters are bool, int, string, decimal and DateTime types, the detection works fine out of the box and OnParametersSet() will not be called unless the value of the parameters have changed.

For enum parameters or for more complex parameters, OnParametersSet() is called each time when the parent component (or page) re-renders.

This is also documented in the official Blazor docs here: https://learn.microsoft.com/en-us/aspnet/core/blazor/components/lifecycle?view=aspnetcore-3.1#after-parameters-are-set

In your code, you can write simple checks to see whether the actual value of the component's parameters changed, and only call your processing in case of the detected change.

like image 136
rk72 Avatar answered Dec 11 '25 07:12

rk72


I fixed it by first setting the value in OnInitializedAsync and then keeping a local copy to track if the Parameter value actually changed. I check for changes in OnParametersSetAsync and do stuff again if the value actually changed.

protected override async Task OnInitializedAsync()
{
    //initalize internal code and do stuff
    _internalCode = ParamCode;

    //do stuff
}

protected override async Task OnParametersSetAsync()
{
    //only do stuff again if the incoming parameter actually changed
    if (_internalCode != ParamCode)
    {
        _internalCode = ParamCode;

        //do stuff
    }
}
like image 36
Homer Avatar answered Dec 11 '25 05:12

Homer



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!