Подарки от программис'тов
То, что в Блейзор сотворили с байндингами - это конечно полный трындец. По сравнению с тем же WPF. Штуки 4 вида байндингов, и на каждый вариант - свой синтаксис и условности. Не как в WPF - забайндил и выбрал вариант (односторонний, двусторонний и т.п.).
Байндинги в Блейзор:
one-way between view and view model (or code behind for view) of the same component:
@PropName - in view
two-way between view and view model of the same component:
@bind-PropName - in view
two-way between two components:
Parameter + EventCallback + code that invokes the event callback - in code behind of the child component
<ChildComponent @bind-ChildPropName="parentFieldOrProperty" @bind-PropName:event="ChildEventCallback"> - in view of the parent component
Специально выделил жирным в последней строчке - жонглирование именами членов двух компонентов.
Плюс всякие неочевидные тонкости, о которых надо знать, типа
"Generally, avoid creating components that write directly to their own component parameters. For more information, see ASP.NET Core Razor components."
Т.е. у вас есть свойство с атрибутом "параметр", но вы не можете в него писать. Нужно свойство-обёртку для него сделать:
[Parameter]
public string? ChildMessage { get; set; }
private string BoundValue
{
get => ChildMessage ?? string.Empty;
set => ChildMessageChanged.InvokeAsync(value);
}Ладно с байндингами, но тьюториалы по ним тоже кучу вещей не договаривают. Например, тут приводится двусторонний байндинг лишь для представления и коуд бехайнд, а для двухстороннего байндинга между разными компонентами нужно использовать параметры и кучу дополнительного кода (коллбеки, хендлеры), как показано здесь или здесь (последняя ссылка, кстати, на тоже немного устаревший тьюториал - там некоторые вещи из 6 версии фреймворка отсутствуют, но сейчас точно не помню, какие).
В который раз убеждаюсь, что лучше читать оригинальный МСДН. Там тьюториалы тоже иногда замудрёно написаны, но хотя бы актуальная информация и примеры есть.
one-way between view and view model (or code behind for view) of the same component:
@PropName - in view
two-way between view and view model of the same component:
@bind-PropName - in view
two-way between two components:
Parameter + EventCallback + code that invokes the event callback - in code behind of the child component
<ChildComponent @bind-ChildPropName="parentFieldOrProperty" @bind-PropName:event="ChildEventCallback"> - in view of the parent component
Сравните эти портянки с WPF-скими байндингами. Там лишь в коде надо реализовать INotifyPropertyCHanged, а в разметке всё просто указывается, плюс вариант байндинга.
Когда надо связать иерархию компонентов, то что в Блейзор, что в ВПФ начинается акробатика: в Блейзор начинаем пробрасывать значения по иерархии компонентов посредством тонн кода, а в ВПФ - жонглировать с разными расширениями разметки по поиску таргета для байндинга в иерархии контролов.
