blazor双向绑定是否可以使用一个参数和相同属性的表达式

Question

我正在创建一个组件来简化应用程序中的文本区域。我已经设置了双向绑定和验证（使用 FluentValidation）。我的问题是，对于该组件的每次使用，我都会调用同一属性两次。我想知道是否有一种方法可以只引用该属性一次，同时保留双向绑定和验证引用。关于如何让

<InputTextArea>

控制在这种情况下工作的任何其他改进或指导也很棒。

我的组件的用法：

<FormTextArea @bind-Value="User.FirstName" ValidationFor="() => User.FirstName" />

这是我的

FormTextArea.razor

组件：

@using System.Linq.Expressions;

<div class="col-12">
    <label class="form-label" for="@ID">@DisplayLabel</label>
    <textarea @bind="CurrentValue" id="@ID" class="@ValidationCssClass" rows="2" />
    <ValidationMessage For="ValidationFor" />
</div>


@code {

    [Parameter]
    public string Value { get; set; }

    [Parameter]
    public EventCallback<string> ValueChanged { get; set; }

    protected string CurrentValue
    {
        get
        {
            return Value;
        }
        set
        {
            if (!EqualityComparer<string>.Default.Equals(value, Value))
            {
                IsModified = true;
                Value = value;
                ValueChanged.InvokeAsync(Value);
                EditContext.Validate();
                EditContext.NotifyValidationStateChanged();
                StateHasChanged();
            }
        }
    }

    [CascadingParameter]
    public EditContext EditContext { get; set; }

    [Parameter]
    public Expression<Func<string>> ValidationFor { get; set; }

    [Parameter]
    public string ID { get; set; } = Guid.NewGuid().ToString();

    [Parameter]
    public string Label { get; set; }

    string DisplayLabel => string.IsNullOrEmpty(Label) ? PropertyHelper.GetDisplayName(ValidationFor) : Label;

    // The <InputTextArea> Wasn't getting the correct validation class so had to do it manually
    bool IsModified { get; set; } = false;
    string ValidationCssClass => $"form-control {(IsModified ? "modified" : "")} {EditContext.FieldCssClass(ValidationFor)}";
}

Answer 1

您应该能够修改此：

    [Parameter] public Expression<Func<string>> ValidationFor { get; set; }

对此：

    [Parameter] public Expression<Func<string>> ValueExpression { get; set; }

然后 Razor 编译器将为您完成这项工作。