Question

您好社区，我在放置bind-value和onchange时遇到问题，显示以下错误：

The attribute 'onchange' is used two or more times for this element. Attributes must be unique (case-insensitive). The attribute 'onchange' is used by the '@bind' directive attribute.

这是我的input checkbox：

<div class="form-group col-md-2">
  <div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch1" @bind-value="@ProveedorEstadoCarrito.Cotizacion.Aceptada" @onchange="e => CheckChanged(e)">
<label class="custom-control-label" for="customSwitch1">Aceptada</label>
 </div>
</div>

这是事件：

private Boolean Aceptada = false;
private async Task CheckChanged(ChangeEventArgs ev)
{
    Aceptada = (Boolean)ev.Value;
    ProveedorEstadoCarrito.Cotizacion.Aceptada = Aceptada;       
    if (Aceptada == true)
    {
        var httpResponse = await repositorio.Put("api/Cotizacion", ProveedorEstadoCarrito.Cotizacion);
        if (httpResponse.Error)
        {
            await mostrarMensajes.MostrarMensajeError(await httpResponse.GetBody());
        }
        else
        {
            navigationManager.NavigateTo("/formulario-cotizacion");
        }
    }
}

我希望如果单击bind来激活该复选框，

Answer 1

首先，您通常不绑定到value属性。它保持固定状态，并且在存在时以及在表单元素内时，将作为表单数据传递到服务器。

您想要的是选中的属性，如下面的代码片段所示：

<input type="checkbox" checked="@selected" 
       @onchange="@((args) => selected = (bool) args.Value)" /> 

@code {
    private bool selected;
}

上面的代码显示了如何绑定到复选框元素。如您所见，以上代码创建了一个双向数据绑定，从变量到元素，从元素到变量。涉及value属性。相同的用法适用于单选按钮元素。与其他输入元素不同，两者都使用checked属性，而不是value属性。

您也可以使用以下变体：

<input type="checkbox" @bind="selected" />

等同于上面的代码：一个选中的属性+ onchange事件，但是上面的版本可以让您解决问题。您的代码如下所示：

<input type="checkbox" class="custom-control-input" id="customSwitch1" checked="@ProveedorEstadoCarrito.Cotizacion.Aceptada" @onchange="CheckChanged">

和

private async Task CheckChanged(ChangeEventArgs ev)
{
    Aceptada = (Boolean)ev.Value;
    ProveedorEstadoCarrito.Cotizacion.Aceptada = Aceptada;       
    if (Aceptada == true)
    {

希望这对您有帮助...

Answer 2

不能。但是您可以设置checked=ProveedorEstadoCarrito.Cotizacion.Aceptada来更新复选框的状态，对于@onchange事件，请执行@onchange=CheckChanged，在这种方法中，您可以设置ProveedorEstadoCarrito.Cotizacion.Aceptada = (bool) ev.Value;

如何在同一输入复选框中放置绑定值和onchange？

2 个答案: