mirror of
https://gitee.com/LongbowEnterprise/BootstrapBlazor.git
synced 2024-12-04 21:20:16 +08:00
!1625 feat(#I423P6): add OnValueChanged callback on ValidateBase component
* doc: 更新 Cascader 参数文档 * feat: ValidateBase 增加 OnValueChanged 回调方法 * feat: Dropdown 支持集成
This commit is contained in:
parent
790ce871af
commit
aa3455c6e2
@ -4,28 +4,28 @@
|
||||
<Block Title="Cascader 级联选择" Introduction="提供各种颜色的下拉选择框">
|
||||
<div class="row g-3">
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Color="Color.Primary" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Color="Color.Primary" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Color="Color.Success" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Color="Color.Success" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Color="Color.Danger" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Color="Color.Danger" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Color="Color.Warning" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Color="Color.Warning" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Color="Color.Info" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Color="Color.Info" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Color="Color.Secondary" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Color="Color.Secondary" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<Cascader TValue="string" Color="Color.Dark" Items="@Items" OnValueChanged="@OnItemChanged"></Cascader>
|
||||
<Cascader TValue="string" Color="Color.Dark" Items="@Items" OnSelectedItemChanged="@OnItemChanged"></Cascader>
|
||||
</div>
|
||||
</div>
|
||||
<Logger @ref="Trace" class="mt-3" />
|
||||
|
@ -84,7 +84,7 @@ namespace BootstrapBlazor.Shared.Pages
|
||||
{
|
||||
new EventItem()
|
||||
{
|
||||
Name = "OnValueChanged",
|
||||
Name = nameof(Cascader<string>.OnSelectedItemChanged),
|
||||
Description="级联选择选项改变时触发此事件",
|
||||
Type ="Func<CascaderItem[], Task>"
|
||||
}
|
||||
@ -148,4 +148,4 @@ namespace BootstrapBlazor.Shared.Pages
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -56,7 +56,7 @@ namespace BootstrapBlazor.Components
|
||||
/// ValueChanged 方法
|
||||
/// </summary>
|
||||
[Parameter]
|
||||
public Func<CascaderItem[], Task>? OnValueChanged { get; set; }
|
||||
public Func<CascaderItem[], Task>? OnSelectedItemChanged { get; set; }
|
||||
|
||||
[Inject]
|
||||
[NotNull]
|
||||
@ -190,7 +190,7 @@ namespace BootstrapBlazor.Components
|
||||
|
||||
CurrentValueAsString = value;
|
||||
|
||||
if (OnValueChanged != null) await OnValueChanged.Invoke(_selectedItems.ToArray());
|
||||
if (OnSelectedItemChanged != null) await OnSelectedItemChanged.Invoke(_selectedItems.ToArray());
|
||||
}
|
||||
|
||||
private void RefreshDisplayValue() => _displayText = string.Join("/", _selectedItems.Select(item => item.Text));
|
||||
|
@ -60,7 +60,7 @@ namespace BootstrapBlazor.Components
|
||||
/// </summary>
|
||||
/// <param name="item"></param>
|
||||
/// <returns></returns>
|
||||
private string? ActiveItem(SelectedItem item) => CssBuilder.Default("dropdown-item")
|
||||
protected string? ActiveItem(SelectedItem item) => CssBuilder.Default("dropdown-item")
|
||||
.AddClass("active", () => item.Value == CurrentValueAsString)
|
||||
.Build();
|
||||
|
||||
@ -81,7 +81,7 @@ namespace BootstrapBlazor.Components
|
||||
/// <summary>
|
||||
/// 下拉框选项点击时调用此方法
|
||||
/// </summary>
|
||||
private async Task OnItemClick(SelectedItem item)
|
||||
protected async Task OnItemClick(SelectedItem item)
|
||||
{
|
||||
if (!item.IsDisabled)
|
||||
{
|
||||
|
@ -62,12 +62,6 @@ namespace BootstrapBlazor.Components
|
||||
[Parameter]
|
||||
public Color Color { get; set; } = Color.Success;
|
||||
|
||||
/// <summary>
|
||||
///
|
||||
/// </summary>
|
||||
[Parameter]
|
||||
public Func<bool, Task>? OnValueChanged { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 点击控件时触发此方法
|
||||
/// </summary>
|
||||
|
@ -82,6 +82,10 @@ namespace BootstrapBlazor.Components
|
||||
{
|
||||
_ = ValueChanged.InvokeAsync(value);
|
||||
}
|
||||
if (OnValueChanged != null)
|
||||
{
|
||||
_ = OnValueChanged.Invoke(value);
|
||||
}
|
||||
if (!SkipValidate && FieldIdentifier != null)
|
||||
{
|
||||
EditContext?.NotifyFieldChanged(FieldIdentifier.Value);
|
||||
@ -145,6 +149,12 @@ namespace BootstrapBlazor.Components
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获得/设置 Value 改变时回调方法
|
||||
/// </summary>
|
||||
[Parameter]
|
||||
public Func<TValue, Task>? OnValueChanged { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 获得/设置 类型转化失败格式化字符串 默认为 null
|
||||
/// </summary>
|
||||
|
Loading…
Reference in New Issue
Block a user