BarnumBailey's questions

Blazor .NET 6.0, tenho o elemento select básico:

<select id="ProductItems" @onchange="ProductSelections" multiple size="10">
    @if (items!= null)
    {
        @foreach (var item in items)
        {
            <option value="@item.Id">@item.Description</option>
        }
    }
</select>

Fui solicitado a fornecer um botão que limpará a lista de todas as opções selecionadas. Não quero ter uma solução com muitos códigos e também não quero codificar nenhum js.

Uma solução que funciona é buscar novamente os dados quando o botão é clicado:

List<MyItems> items = new List<MyItems>();
....
private async void ButtonClearClick() 
{
    items = new List<MyItems>();  // clear variable.
    items = await GetAllItems();  // web api call to reload variable.
    StateHasChanged();
}

Isso faz com que a seleção seja brevemente recolhida e recarregada, mas pelo menos todas as opções são desmarcadas.
Em seguida, comecei a refatorar essa solução para evitar a chamada de banco de dados e pensei que usar uma variável temporária resultaria na mesma coisa:

private void ButtonClearClick2() 
{
    List <MyItems> temp = new List<MyItems>();
    items.ForEach(i => temp.Add(i)); // copy into temp.

    items = new List<MyItems>(); // clear variable.
    temp.ForEach(i => items.Add(i)); // copy back into variable.
    StateHasChanged();
}

No entanto, isso NÃO funciona, as opções ainda estão selecionadas. Também não há efeito de colapso/recarregamento, o que me indica que nada foi recarregado. Alguém pode explicar o que há de errado com a segunda tentativa? o que estou perdendo?

Eu tenho um projeto do lado do servidor Blazor .net 6 no VS 2022. Minha página do razor tem dois componentes e quero passar dados do componente1 para o componente2.

Comp1 possui um botão que quando clicado dispara um evento:

//Component1.razor
<input type="button" value="PassTheData" @onclick="PassTheData" />

//Component1.razor.cs
[Parameter] public string TheData { get; set; } = string.Empty;
[Parameter] public EventCallback<string> PassTheDataEvent { get; set; }
....
private async void PassTheData() {
   TheData = "DATA!!!!!!!!!!!!!!!!!!";
   await PassTheDataEvent.InvokeAsync(TheData);
}

Comp2 possui código mínimo para receber apenas os dados:

//Component2.razor
<h3>Comp 2</h3>
The data is:  @TheDataComp2

//Component2.razor.cs
[Parameter] public string TheDataComp2 { get; set; } = string.Empty;

Meu entendimento é que a página pai obtém os dados de comp1 para comp2. Na marcação comp1, vinculo a propriedade comp1 a uma propriedade pai, e essa propriedade pai é passada para comp2:

//Parent1.razor
<Comp1 @bind-TheData="theDataParent"></Comp1>
<br />
<Comp2 TheDataComp2="@theDataParent"></Comp2>

//Parent1.razor.cs
private string theDataParent = string.Empty;

No entanto, quando carrego a página pai, recebo este erro:

[2023-08-24T17:45:15.942Z] Erro: System.InvalidOperationException: o objeto do tipo 'UI.Comp1' não possui uma propriedade correspondente ao nome 'TheDataChanged'. em Microsoft.AspNetCore.Components.Reflection.ComponentProperties.ThrowForUnknownIncomingParameterName(Tipo targetType, String parâmetroName) em Microsoft.AspNetCore.Components.Reflection.ComponentProperties.SetProperties(ParameterView& parâmetros, alvo de objeto) em Microsoft.AspNetCore.Components.ParameterView.SetParameterProperties(Object alvo) em Microsoft.AspNetCore.Components.ComponentBase.SetParametersAsync(parâmetros ParameterView) em Microsoft.AspNetCore.Components.Rendering.ComponentState.SupplyCombinedParameters(ParameterView directAndCascadingParameters)

Não entendo o que é essa propriedade chamada TheDataChanged que está sendo procurada. Alguém pode ajudar? Se eu remover a @bind-TheData="theDataParent"marcação, a página carrega bem.