主页 / user-8149311

BarnumBailey's questions

Martin Hope
BarnumBailey
Asked: 2023-09-02 00:23:45 +0800 CST
  • 5

Blazor .NET 6.0，我有基本的选择元素：

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

我被要求提供一个按钮来清除任何选定选项的列表。我不想有一个代码繁重的解决方案，我也不想编写任何js代码。

一种有效的解决方案是，如果我在单击按钮时重新获取数据：

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();
}

这确实会导致选择短暂折叠并重新加载，但至少所有选项都被清除。
接下来，我转向重构该解决方案以避免数据库调用，并认为使用临时变量可以完成同样的事情：

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();
}

然而这不起作用，选项仍然被选中。也没有崩溃/重新加载效果，这告诉我没有重新加载任何内容。有人可以解释第二次尝试出了什么问题吗？我缺少什么？

blazor
Martin Hope
BarnumBailey
Asked: 2023-08-25 02:19:57 +0800 CST
  • 5

我在 VS 2022 中有一个 Blazor .net 6 服务器端项目。我的 razor 页面有两个组件，我想将数据从组件 1 传递到组件 2。

Comp1 有一个按钮，单击该按钮将触发一个事件：

//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 具有最少的代码来仅接收数据：

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

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

我的理解是父页面获取comp1到comp2的数据。在 comp1 标记中，我将 comp1 属性绑定到父属性，并将该父属性传递给 comp2：

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

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

但是，当我加载父页面时，我收到此错误：

[2023-08-24T17:45:15.942Z] 错误：System.InvalidOperationException：“UI.Comp1”类型的对象没有与名称“TheDataChanged”匹配的属性。在 Microsoft.AspNetCore.Components.Reflection.ComponentProperties.ThrowForUnknownIncomingParameterName（类型 targetType，字符串参数名称） 在 Microsoft.AspNetCore.Components.Reflection.ComponentProperties.SetProperties（ParameterView& 参数，对象目标） 在 Microsoft.AspNetCore.Components.ParameterView.SetParameterProperties（对象）目标）在 Microsoft.AspNetCore.Components.ComponentBase.SetParametersAsync（ParameterView 参数） 在 Microsoft.AspNetCore.Components.Rendering.ComponentState.SupplyCombinedParameters（ParameterView directAndCascadingParameters）

我不明白正在寻找的这个名为 TheDataChanged 的​​属性是什么。有人可以帮忙吗？如果我删除 @bind-TheData="theDataParent"标记，页面加载正常。

blazor