Attribute splatting

When a child component has many parameters, it can be tedious to assign each of the values in HTML. To avoid having to do that, we can use attribute splatting.

With attribute splatting, the attributes are captured in a dictionary and then passed to the component as a unit. One attribute is added per dictionary entry. The dictionary must implement IEnumerable<KeyValuePair<string, object>> or IReadOnlyDictionary<string, object> with string keys. We reference the dictionary using the @attributes directive.

This is the code for a component called BweButton that has quite a few parameters:

BweButton.razor

<button class="@Class" disabled="@Disabled" title="@Title" @onclick="@ClickEvent">
    @ChildContent
</button>
@code {
    [Parameter] public string Class { get; set; }
    [Parameter] public bool Disabled { get; set; }
 ...