Навигация в приложениях Blazor Hybrid

Содержание

Пример использования NavigationManager
Свойства, методы и события NavigationManager
Итого

При разработке приложения Blazor Hybrid возможна ситуация, при которой вам потребуется осуществит переход по заданному пути непосредственно в коде C#. Для навигации в приложении непосредственно из кода C# используется экземпляр класса NavigationManager.

Пример использования NavigationManager

Создадим новое приложение Blazor Hybrid и изменим код компонента Home следующим образом:

@page "/"

@inject NavigationManager Navigation

<h1>Hello, world!</h1>

Welcome to your new app.

<button @onclick="NavigateToCounter">Счётчик</button>

@code{
    private void NavigateToCounter()
    {
        Navigation.NavigateTo("/counter");   
    }
}

Разберем этот пример. Первое, на что необходимо обратить внимание — это новая директива Razor — @inject. Эта директива используется для внедрения в компонент сервиса (службы) из контейнера зависимостей. Директива используется следующим образом:

@inject тип имя

тип — тип внедряемого сервиса (службы). В нашем случае — это NavigationManager.
имя — имя переменной, с которой мы будем далее работать в коде C#. В нашем случае — это Navigation

В коде компонента мы объявили метод NavigateToCounter() в котором используем NavigationManager для перехода к странице счётчика:

Navigation.NavigateTo("/counter");

а в разметке компонента мы добавляем кнопку для которой назначаем в качестве обработчика события onclick наш метод:

<button @onclick="NavigateToCounter">Счётчик</button>

Теперь можете запустить приложение, нажать на кнопку «Счётчик» и убедиться, что приложение перейдет к странице Counter.

Свойства, методы и события NavigationManager

Ниже представлены члены класса NavigationManager, которые мы можем использовать в нашем приложении:

	Имя	Тип	Описание
Свойство	`BaseUri`	`string`	Возвращает базовый URI (с завершающей косой чертой), который можно добавить в начало относительных путей URI для получения абсолютного URI. Обычно, BaseUri соответствует атрибуту `href` элемента документа `<base>` в `wwwroot/index.html`
Свойство	`Uri`	`string`	Возвращает текущий абсолютный URI
Метод	`NavigateTo()`	`void`	Позволяет переходить по указанному URL. Этот метод перегружен и имеет несколько версий. Наиболее часто используются следующие версии метода: `public void NavigateTo (string uri);` `public void NavigateTo (string uri, bool forceLoad);`
Метод	`ToAbsoluteUri()`	`Uri`	Преобразует относительный URL в абсолютный
Метод	`ToBaseRelativePath()`	`string`	Преобразует абсолютный URI в относительный URI (относительно базового префикса)
Событие	`LocationChanged`	`EventHandler<LocationChangedEventArgs>`	Срабатывает при изменении расположения навигации

В приложениях Blazor Hybrid часть представленных методов и свойств, в принципе, бесполезны, хотя и могут использоваться. Например, мы можем получить значения свойств BaseUri и Uri, но по большому счёту нам эти свойства мало пригодятся. Однако, метод NavigateTo() вполне может использоваться в приложении для программной навигации по страницам приложения.

Итого

Для навигации в приложении Blazor Hybrid непосредственно из кода C# используется сервис NavigationManager, у которого определен метод NavigateTo(). Чтобы использовать этот сервис в компоненте Razor необходимо использовать директиву @inject для запроса сервиса из контейнера зависимостей.