c# - 使用可为空和不可为空的日期值创建 Blazor 自定义日期选择器组件

Question

我想在 Blazor 中创建自定义日期选择器组件。我的代码是这样的

<div class="form-group">
<label>@Title</label>
<input type="date" class="form-control" @bind="Value" />
</div>

@code{
        [Parameter]
        public string Title { get;set; }
        private DateTime? _value;
        [Parameter]
        public DateTime? Value
        {
            get
            {
                return _value;
            }
            set
            {
                if (Value == _value)
                {
                    return;
                }
                _value = value;
                ValueChanged.InvokeAsync(value);

            }
        }

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

}

问题是组件只有在值为可为空的 DateTime(DateTime？)时才有效，如果值为 DateTime 则抛出错误

cannot convert from 'Microsoft.AspNetCore.Components.EventCallback<System.DateTime>' to 'Microsoft.AspNetCore.Components.EventCallback'

我决定让绑定(bind)值接受可为空，因为我认为它会接受这两种类型。它的工作原理与 int、double ...等类似。所以我想让它接受 DateTime 和 DateTime？有什么想法吗？

更新:我试图让组件接受通用类型但它抛出错误无法将 T 转换为 DateTime

Answer 1

这里是你的泛型组件:

@using System.Globalization
@using System

@typeparam TValue

<div class="form-group">
<label>@Title</label>
<input 
    type="date"
    class="form-control" 
    value="@FormatValueAsString(Value)"
    @onchange="@OnChange"
/>
</div>

@code {
    private const string DateFormat = "yyyy-MM-dd";
    CultureInfo provider = CultureInfo.InvariantCulture;
    private TValue _value;
    [Parameter] public string Title {get; set;}
    [Parameter] public TValue Value
    {
        get
        {
            return _value;
        }
        set
        {
            if (EqualityComparer<TValue>.Default.Equals(value , _value))
            {
                return;
            }
            _value = value;
            ValueChanged.InvokeAsync(value);

        }
    }

    [Parameter] public EventCallback<TValue> ValueChanged { get; set; }
    private void OnChange( ChangeEventArgs args)
    {
        try
        {
            Value = 
                (TValue)(object)
                DateTime
                .ParseExact(args.Value.ToString(),DateFormat, provider);
        }
        catch {
            Value = default(TValue); // not sure you want this
        }        
    }
    protected string FormatValueAsString(TValue? value)
    {
        switch (value)
        {
            case DateTime dateTimeValue:
                var r = BindConverter.FormatValue(dateTimeValue, DateFormat, provider);
                return r;
            default:
                return string.Empty; 
        }
    }    
}

但是...我建议你继承自InputDate .

查看"Option 2 (recomended): Through inheritance from InputBase"

在 https://blazorrepl.com/repl/QlYPQBFj03U9ITNe13 查看我