Skip to content

Navigation Lifecycle events #28527

Closed
Closed
@MariovanZeist

Description

@MariovanZeist

Summary

We would like to implement a Navigation lifecycle event, that should be called BEFORE navigation is performed, with the ability to cancel that navigation.

Motivation and goals

The main reason for this lifecycle event is that currently, we have no way of canceling a navigation event, which is useful if for example the user has made some changes in a form, but navigates away from that page before those changes could be stored.

For reference, some work has already been done in #24417 ,
One of the problems we face in that PR is that we want the event to be asynchronous. So using an EventHandler is out of the question. Also the location on where to place this event (Navigationmanager, Router) is under discussion.

In scope

Canceling navigation Lifecycle events.

Out of scope

Risks / unknowns

The performance issue I can think of is that every navigation event (clicking a href for example) in Serverside Blazor would incur an additional client/server callback, even when no one is listening. This can be mitigated by only calling the lifecycle event when a listener is actually supplied. (This has been addressed in the PR)

Examples

//Set to true when Data has been modified that has not yet been stored
bool PageIsDirty { get; set;}

//Function that is called when a navigation event occurs (returns true when navigation should be canceled)
ValueTask<bool> LocationChanging(string uri, NavigationOptions options)
{
  if (PageIsDirty)
  {
    var result = await ShowDialog($"Changes have not been saved. Are you sure you want to navigate to:{uri}", Buttons.YesNo);
    return result != Button.Yes; 
  }
  return false;
}

Metadata

Metadata

Assignees

Labels

area-blazorIncludes: Blazor, Razor Componentsdesign-proposalThis issue represents a design proposal for a different issue, linked in the description

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions