我有以下 InputSelect 代码
<InputSelect class="form-control form-control form-control-sm"
placeholder="Role"
disabled="@IsReadOnly"
@bind-Value="Model.Role"
@onchange="@RoleChanged">
<option value="Member">Member</option>
<option value="Admin">Admin</option>
<option value="Pioner">Pioneer</option>
<option value="Retailer">Retailer</option>
</InputSelect>
对于代码:
bool ShowCreated;
bool ShowUpdated;
bool IsReadOnly;
string SelectedRole;
public EditForm AccountForm;
public Multi.Dtos.RegistrationDto Model = new Dtos.RegistrationDto() { Role = "Member" };
public void RoleChanged(ChangeEventArgs e)
{
SelectedRole = e.Value.ToString();
Console.WriteLine(e.Value);
}
当我尝试选择一个新项目时,不会调用 RoleChange 函数。有人可以指出这有什么问题。正确的值已更改,但未调用事件。
最佳答案
笔记:
将@onchange 编译器指令应用于它。该指令适用于
元素,通常但不一定具有 value 属性来形成 so-
称为双向数据绑定(bind)。
生成支持组件之间双向数据绑定(bind)的代码。申请
@bind-Value 到 InputSelect 组件需要你(已经在这个
Blazor 团队的案例)来定义一个名为 Value 的参数属性和一个
EventCallback 'delegate',通常命名为 ValueChanged。值(value)和
ValueChanged 是 InputSelect 组件的属性。
有几种方法可以做到这一点:
<InputSelect ValueExpression="@(()=>comment.Country)"
Value="@comment.Country"
ValueChanged="@((string value) => OnValueChanged(value ))">
<option value="">Select country...</option>
<option value="USA">USA</option>
<option value="Britain">Britain</option>
<option value="Germany">Germany</option>
<option value="Israel">Israel</option>
</InputSelect>
和private Task OnValueChanged(string value)
{
// Assign the selected value to the Model
comment.Country = value;
return Task.CompletedTask;
}
正如 dani herrera 所建议的,您还可以在模型中实现 INotifyPropertyChanged.PropertyChanged 事件。如果您想取消 Forms 组件(包括 EditForm)并使用普通的 HTML 标签,您可以这样做,在这种情况下,您将能够执行以下操作:<input type="text" value="@MyValue" @onchange=OnChange"/>
当然,你的模型类会很厚,它应该与 EditContext 通信......希望这可以帮助...
关于c# - onChange 事件未触发 Blazor InputSelect,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61756167/