Исходный код вики Сценарии
Редактировал(а) Alexandr Fokin 2026/01/31 15:46
Последние авторы
| author | version | line-number | content |
|---|---|---|---|
| 1 | |(% style="width:254px" %)Отправка изменений пользовательского интерфейса с сервера Blazor в браузер при возникновении событий сервера|(% style="width:1239px" %)((( | ||
| 2 | Pushing UI changes from Blazor Server to browser on server raised events | ||
| 3 | [[https:~~/~~/swimburger.net/blog/dotnet/pushing-ui-changes-from-blazor-server-to-browser-on-server-raised-events>>url:https://swimburger.net/blog/dotnet/pushing-ui-changes-from-blazor-server-to-browser-on-server-raised-events]] | ||
| 4 | |||
| 5 | mikoskinen/Blazor.EventAggregator | ||
| 6 | [[https:~~/~~/github.com/mikoskinen/Blazor.EventAggregator>>url:https://github.com/mikoskinen/Blazor.EventAggregator]] | ||
| 7 | Дополнение: После просмотра исходников считаю, что | ||
| 8 | лучше реализовать свое решение на основе событий жизненного цикла OnInitialized(Async) для подписки и Dispose(Async) для отписка от события | ||
| 9 | ))) | ||
| 10 | |(% style="width:254px" %)Проблема внедрения зависимостей через конструктор|(% style="width:1239px" %)((( | ||
| 11 | Can we talk about constructor injection now that partial classes are here? #18088 | ||
| 12 | [[https:~~/~~/github.com/dotnet/aspnetcore/issues/18088>>url:https://github.com/dotnet/aspnetcore/issues/18088]] | ||
| 13 | |||
| 14 | Возможное решение - собственная реализация IComponentActivator | ||
| 15 | |||
| 16 | Blazor: Implement IComponentActivator to get components from DI | ||
| 17 | [[https:~~/~~/github.com/abpframework/abp/issues/5527>>url:https://github.com/abpframework/abp/issues/5527]] | ||
| 18 | |||
| 19 | [[abp/framework ServiceProviderComponentActivator >>url:https://github.com/abpframework/abp/blob/48c52625f4c4df007f04d5ac6368b07411aa7521/framework/src/Volo.Abp.AspNetCore.Components/Volo/Abp/AspNetCore/Components/DependencyInjection/ServiceProviderComponentActivator.cs||style="outline-width: 0px !important; user-select: auto !important;"]] | ||
| 20 | ))) | ||
| 21 | |(% style="width:254px" %)Открыть новую вкладку|(% style="width:1239px" %)How can I open a new window | ||
| 22 | [[https:~~/~~/stackoverflow.com/questions/62769031/how-can-i-open-a-new-window-without-using-js>>url:https://stackoverflow.com/questions/62769031/how-can-i-open-a-new-window-without-using-js]] | ||
| 23 | |(% style="width:254px" %)Работа с файлами|(% style="width:1239px" %)((( | ||
| 24 | Загрузка файлов: | ||
| 25 | |||
| 26 | Отправка файлов в ASP.NET Core Blazor | ||
| 27 | [[https:~~/~~/docs.microsoft.com/ru-ru/aspnet/core/blazor/file-uploads?view=aspnetcore-5.0&pivots=webassembly>>url:https://docs.microsoft.com/ru-ru/aspnet/core/blazor/file-uploads?view=aspnetcore-5.0&pivots=webassembly]] | ||
| 28 | |||
| 29 | Для Net.Core 3.1 | ||
| 30 | SteveSandersonMS/BlazorInputFile (Archived) | ||
| 31 | [[https:~~/~~/github.com/SteveSandersonMS/BlazorInputFile>>url:https://github.com/SteveSandersonMS/BlazorInputFile]] | ||
| 32 | |||
| 33 | ---- | ||
| 34 | |||
| 35 | Скачивание файла: | ||
| 36 | |||
| 37 | Для скачивания файла можно сделать endpoint - api controller и кнопку, которая перенаправляет на него. | ||
| 38 | Можно использовать NavigationManager. | ||
| 39 | ))) | ||
| 40 | |(% style="width:254px" %)Динамические отрисовка компонентов | ||
| 41 | (динамическое выбор типа компонента)|(% style="width:1239px" %)((( | ||
| 42 | How to Dynamically Render a Component in a Blazor Application | ||
| 43 | https://www.syncfusion.com/blogs/post/how-to-dynamically-render-a-component-in-a-blazor-application.aspx | ||
| 44 | |||
| 45 | Blazor - Как динамически создавать компоненты | ||
| 46 | https://question-it.com/questions/789772/blazor-kak-dinamicheski-sozdavat-komponenty | ||
| 47 | ))) | ||
| 48 | |(% style="width:254px" %)Виртуализация списков | ||
| 49 | (частичный рендер списка)|(% style="width:1239px" %)Виртуализация компонентов ASP.NET Core Blazor | ||
| 50 | https://docs.microsoft.com/ru-ru/aspnet/core/blazor/components/virtualization?view=aspnetcore-5.0 | ||
| 51 | |(% style="width:254px" %)Рендер Raw HTML|(% style="width:1239px" %)((( | ||
| 52 | Есть ли в Blazor эквивалент Html.Raw? | ||
| 53 | [[https:~~/~~/reddeveloper.ru/questions/yest-li-v-blazor-ekvivalent-html-raw-jNW4j>>https://reddeveloper.ru/questions/yest-li-v-blazor-ekvivalent-html-raw-jNW4j]] | ||
| 54 | |||
| 55 | {{code language="c#"}} | ||
| 56 | @((MarkupString)"<div>Raw html</div>") | ||
| 57 | {{/code}} | ||
| 58 | ))) | ||
| 59 | |(% style="width:254px" %)Тип RenderFragment|(% style="width:1239px" %)((( | ||
| 60 | |(% style="width:867px" %)Позволяет передавать блок кода разметки Blazor в качестве параметра или возвращать как результат функции. | ||
| 61 | [[https:~~/~~/learn.microsoft.com/ru-ru/dotnet/api/microsoft.aspnetcore.components.renderfragment>>https://learn.microsoft.com/ru-ru/dotnet/api/microsoft.aspnetcore.components.renderfragment]]|(% style="width:343px" %)((( | ||
| 62 | |Функция с разметкой.|{{code language="c#"}}RenderFragment MyFunction() => @(<p>hello</>){{/code}} | ||
| 63 | |Вызов OneOf.|{{code language="html"}}<div> | ||
| 64 | @( | ||
| 65 | OneOfHelper.OneOf<Microsoft.AspNetCore.Components.RenderFragment>( | ||
| 66 | value, | ||
| 67 | type1Handler: (typedValue) => @<p>@typedValue.Prop1</p>, | ||
| 68 | type2Handler: (typedValue) => @<p>@typedValue.Prop2</p>,) | ||
| 69 | ) | ||
| 70 | ); | ||
| 71 | </div>{{/code}} | ||
| 72 | ))) | ||
| 73 | |(% style="width:867px" %)Можно использовать при наследовании компонентов, для это зарезервировано имя параметра ChildContent.|(% style="width:343px" %){{code language="html"}}<div> | ||
| 74 | @ChildContent | ||
| 75 | </div>{{/code}} | ||
| 76 | |(% style="width:867px" %)Передача разметки в качестве параметра / содержимого. (Например можно использовать для создания компонентов оберток).|(% style="width:343px" %){{code language="html"}}<WrapperComponent> | ||
| 77 | <ContentParameter1>content1</ContentParameter1> | ||
| 78 | <ContentParameter2>content2</ContentParameter2> | ||
| 79 | </WrapperComponent>{{/code}} | ||
| 80 | ))) | ||
| 81 | |(% style="width:254px" %)Атрибуты html тега.|(% style="width:1239px" %)((( | ||
| 82 | |(% style="width:549px" %)((( | ||
| 83 | Использование переменной для значения атрибута. | ||
| 84 | |||
| 85 | Особенность: Blazor не будет рендерить атрибут, если значение атрибута false или null. (Например это можно использовать для атрибута disabled). | ||
| 86 | |||
| 87 | Blazor InputText: conditionally rendering an attribute | ||
| 88 | [[https:~~/~~/stackoverflow.com/questions/58020174/blazor-inputtext-conditionally-rendering-an-attribute>>https://stackoverflow.com/questions/58020174/blazor-inputtext-conditionally-rendering-an-attribute]] | ||
| 89 | )))|(% style="width:665px" %){{code language="html"}}<div autofocus="@(MyModel.isAutoFocus)"></div> | ||
| 90 | <div autofocus="@(MyModel.GetIsAutoFocus())"></div>{{/code}} | ||
| 91 | |(% style="width:549px" %)Динамическое формирование атрибутов.|(% style="width:665px" %){{code language="html"}}<div @attributes="HandyFunction()"></div> | ||
| 92 | |||
| 93 | @code{ | ||
| 94 | Dictionary<string,object> HandyFunction() | ||
| 95 | { | ||
| 96 | var dict = new Dictionary<string, object>(); | ||
| 97 | if(MyModel.isAutoFocus) dict.Add("autofocus",true); | ||
| 98 | return dict; | ||
| 99 | } | ||
| 100 | }{{/code}} | ||
| 101 | ))) | ||
| 102 | |(% style="width:254px" %)Ссылка на компонент|(% style="width:1239px" %)((( | ||
| 103 | |Add @ref to a Blazor component in a loop | ||
| 104 | [[https:~~/~~/stackoverflow.com/questions/60064510/add-ref-to-a-blazor-component-in-a-loop>>https://stackoverflow.com/questions/60064510/add-ref-to-a-blazor-component-in-a-loop]]| | ||
| 105 | | | | ||
| 106 | ))) | ||
| 107 | |(% style="width:254px" %)[[Взаимодействие с JavaScript>>doc:.Взаимодействие с JavaScript.WebHome]]|(% style="width:1239px" %) |