Blazor 'Global' Параметр - передача между MainLayout.razor, NavMenu.razor, Counter.razor - назад и вперед - PullRequest
2 голосов
/ 22 апреля 2020

При наличии приложения Blazor по умолчанию - , созданного с использованием шаблона сервера Visual Studio 2019 Blazor . Как создать объект GLOBAL , который доступен со всех страниц и компонентов бритвы.

Как бы вы сделали значение «Текущий счетчик» видимым и «динамически» обновленным в MainLayout , NavMenu, страницы индекса?

Текущий счетчик: @ currentCount

  • Использовать [Parameters]?
  • Использовать [CascadingParameter]?
  • Создать класс Stati c?
  • Каков рекомендуемый подход в Blazor?

Ответы [ 3 ]

1 голос
/ 22 апреля 2020

Связь между компонентами может быть реализована тремя способами, в зависимости от ваших требований и потребностей.

  1. Родительский компонент может взаимодействовать со своим дочерним компонентом, передавая параметры компонента и вызывая события, чтобы родитель, что что-то случилось, и наоборот.

  2. Вы можете включить функцию CascadingValue для передачи значения всем дочерним элементам в потоке, которые определяют свойство CascadingParameter. Каскадное значение может быть простой строкой, но оно также может быть полным компонентом. Это достигается путем установки атрибута Value CascadingValue с ключевым словом this из компонента, для которого вы хотите передать ссылку, например:

SomeComponent.razor

<CascadingValue Value="this">
   @ChildContent
</CascadingValue>

Мне не нравится использовать эту функцию. На самом деле, я никогда не использую это. Утверждается, что его использование может быть проблематичным c, et c. Тем не менее, это законная часть Blazor, и нет причин не использовать его, если хотите ...

Служба, которая реализует шаблон состояния и шаблон уведомления. Обычно вы создаете такой сервис для управления состоянием данных вашего приложения, в том числе для хранения данных в коллекциях, извлечения данных из базы данных и т. Д. c., Позволяя компонентам хранить данные в коллекциях сервисов, уведомляя компоненты путем вызова обработчика событий, и передавая им данные, только что добавленные другим компонентом, и т. д. c.

При наличии приложения Blazor «по умолчанию», созданного с использованием шаблона сервера Visual Studio 2019 Blazor. Как создать объект GLOBAL, доступный со всех страниц и компонентов бритвы.

Вам следует внедрить службу. См. Номер 3.

Создать класс c Класс?

Нет, нет классов c. Создать сервис

Каков рекомендуемый подход в Blazor?

Все зависит от ваших потребностей и требований ...

Как Вы бы сделали значение «Текущий счетчик» видимым и «динамически» обновленным на страницах MainLayout, NavMenu, Index?

Только путем создания службы, позволяющей передавать текущий счет из заданного местоположение и передать его другим компонентам, таким как MainLayout, NavMenu, страницы индекса.

Примечание: я подробно ответил на такие вопросы с рабочим кодом. Я не знаю, где они находятся (пока 400 ответов), но вы можете go перейти на страницу моего профиля и найти их.

Надеюсь, это поможет ...

1 голос
/ 22 апреля 2020

Одним из способов сделать это является использование одноэлементной службы, которая внедряется в компоненты, которые разрешают подписку на события. Я обсуждал это с кем-то еще несколько дней на самом деле.

Посетите этот пост , чтобы обсудить динамическое обновление страниц из событий, запущенных из одноэлементного файла, которое обновляется через соединения.

Вот рабочая демонстрация , которую я адаптировал из другого проекта, над которым я работаю, когда вы запускаете этот проект, он предлагает вам открыть другой браузер, скопировать / вставить URL, и имеет счетчик обновлений и текстовое поле для передачи сообщений между страницами. Введите что-нибудь в поле, нажмите кнопку, счетчик обновится на всех страницах со всех подключенных клиентов, и сообщение также перейдет на все страницы и отобразится. Работает кросс-браузер и через соединения.

Подобную концепцию можно использовать для создания таких вещей, как фоновые уведомления о долго выполняющихся задачах, уведомления о входе пользователя в систему и т. Д. c. Довольно гибкий для моих нужд.

1 голос
/ 22 апреля 2020

Есть два способа сделать это.

CascadingParameter и «Контейнер состояний», которые очень хорошо объяснены в этой статье .

Между CascadingParameter и «State Container», вы тот, кто должен знать, как работает ваше приложение и решать, что делать.

Возможно, состояние контейнера будет лучше для чего-то вроде GLOBAL object that is accessible from all the razor pages and components.

Использовать [Параметры]?

Вместо передачи всех параметров компонентам, вы должны использовать CascadingParameter

Создать класс Stati c?

Вместо создания класса c, вы должны использовать «State Container»

...