I'm building an application using Blazor Web-assembly and I want the user to be able to load the application via a route, e.g.
http://www.someapp.com/{Page}/{Item}
If the user selects the above route it should go to {Page} and display {item}.
This works out-of-the-box; however, if the user applies the following steps:
If the {Page} is the same, the components' lifecycle doesn't kick-off even if the route parameter changed. What gives? Is there a way to force it?
Environment: VS2019
.NET CORE: v3.1
Here's some code (based on the Counter component), copy and test it. See for yourself that both methods are executed when you change the parameter value.
Incidentally, it's OnParametersSet
, not
OnSetParameters (not fired)
@page "/counter/{MyCount:int}"
<h1>Counter</h1>
<p>Current count: @currentCount</p>
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
@code {
private int currentCount = 0;
[Parameter]
public int MyCount { get; set; }
protected override void OnParametersSet()
{
Console.WriteLine("OnParametersSet");
}
public override async Task SetParametersAsync(ParameterView parameters)
{
Console.WriteLine("SetParametersAsync");
await base.SetParametersAsync(parameters);
}
private void IncrementCount()
{
currentCount++;
}
}
Note: Since Blazor reuses
the Page ( currently Counter) with varying parameter; that is, it does not re-create
the Page object. That is why life cycle methods such as the OnInitialized[Async) pair run only once, when the component is born.