Skip to content

Commit

Permalink
bug(Select): not show full item after click Clear button (#4291)
Browse files Browse the repository at this point in the history 
* refactor: 重命名使用私有字段代替属性

* fix: 修复开启虚拟滚动后清空按钮导致数据不正确问题

* doc: 更新示例

* refactor: 变量重命名

* test: 更新单元测试

* chore: bump version 8.9.2-beta10

* test: 增加异常保护

* test: 更新单元测试

* refactor: 精简代码逻辑
  • Loading branch information
@ArgoZhang
ArgoZhang authored Sep 12, 2024
1 parent 2dfb64a commit 7247d25
Show file tree
Hide file tree
Showing 6 changed files with 184 additions and 76 deletions.
92 changes: 54 additions & 38 deletions src/BootstrapBlazor.Server/Components/Samples/Selects.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,41 +6,6 @@

<h4>@Localizer["SelectsDescription"]</h4>

<DemoBlock Title="@Localizer["SelectsVirtualizeTitle"]"
Introduction="@Localizer["SelectsVirtualizeIntro"]"
Name="IsVirtualize">
<p>@((MarkupString)Localizer["SelectsVirtualizeDescription"].Value)</p>

<div class="row mb-3">
<div class="col-12 col-sm-12">
<BootstrapInputGroup>
<BootstrapInputGroupLabel DisplayText="ShowSearch" />
<Checkbox @bind-Value="@ShowSearch" />
</BootstrapInputGroup>
</div>
</div>

<p class="code-label">1. 使用 OnQueryAsync 作为数据源</p>
<div class="row mb-3">
<div class="col-6">
<Select IsVirtualize="true" OnQueryAsync="OnQueryAsync" @bind-Value="VirtualItem1" ShowSearch="ShowSearch"></Select>
</div>
<div class="col-6">
<Display TValue="string" Value="@VirtualItem1?.Text"></Display>
</div>
</div>

<p class="code-label">2. 使用 Items 作为数据源</p>
<div class="row">
<div class="col-6">
<Select IsVirtualize="true" Items="VirtualItems" @bind-Value="VirtualItem2" OnSearchTextChanged="OnSearchTextChanged" ShowSearch="ShowSearch"></Select>
</div>
<div class="col-6">
<Display TValue="string" Value="@VirtualItem2?.Text"></Display>
</div>
</div>
</DemoBlock>

<DemoBlock Title="@Localizer["SelectsNormalTitle"]"
Introduction="@Localizer["SelectsNormalIntro"]"
Name="Normal">
Expand Down Expand Up @@ -351,12 +316,22 @@
<DemoBlock Title="@Localizer["SelectsShowSearchTitle"]"
Introduction="@Localizer["SelectsShowSearchIntro"]"
Name="ShowSearch">
<div class="row g-3">
<section ignore>
<div class="row mb-3">
<div class="col-12 col-sm-6">
<BootstrapInputGroup>
<BootstrapInputGroupLabel DisplayText="IsClearable" />
<Checkbox @bind-Value="@_isShowSearchClearable" />
</BootstrapInputGroup>
</div>
</div>
</section>
<div class="row g-3 mt-3">
<div class="col-12 col-sm-6">
<Select TValue="string" Items="Items" ShowSearch="true" />
<Select TValue="string" Items="Items" ShowSearch="true" IsClearable="_isShowSearchClearable" />
</div>
<div class="col-12 col-sm-6">
<Select TValue="string" Items="StringItems" ShowSearch="true" />
<Select TValue="string" Items="StringItems" ShowSearch="true" IsClearable="_isShowSearchClearable" />
</div>
</div>
</DemoBlock>
Expand Down Expand Up @@ -418,6 +393,47 @@
</div>
</DemoBlock>

<DemoBlock Title="@Localizer["SelectsVirtualizeTitle"]"
Introduction="@Localizer["SelectsVirtualizeIntro"]"
Name="IsVirtualize">
<p>@((MarkupString)Localizer["SelectsVirtualizeDescription"].Value)</p>

<div class="row mb-3">
<div class="col-12 col-sm-6">
<BootstrapInputGroup>
<BootstrapInputGroupLabel DisplayText="ShowSearch" />
<Checkbox @bind-Value="@_showSearch" />
</BootstrapInputGroup>
</div>
<div class="col-12 col-sm-6">
<BootstrapInputGroup>
<BootstrapInputGroupLabel DisplayText="IsClearable" />
<Checkbox @bind-Value="@_isClearable" />
</BootstrapInputGroup>
</div>
</div>

<p class="code-label">1. 使用 OnQueryAsync 作为数据源</p>
<div class="row mb-3">
<div class="col-6">
<Select IsVirtualize="true" OnQueryAsync="OnQueryAsync" @bind-Value="VirtualItem1" ShowSearch="_showSearch" IsClearable="_isClearable"></Select>
</div>
<div class="col-6">
<Display TValue="string" Value="@VirtualItem1?.Text"></Display>
</div>
</div>

<p class="code-label">2. 使用 Items 作为数据源</p>
<div class="row">
<div class="col-6">
<Select IsVirtualize="true" Items="VirtualItems" @bind-Value="VirtualItem2" ShowSearch="_showSearch" IsClearable="_isClearable"></Select>
</div>
<div class="col-6">
<Display TValue="string" Value="@VirtualItem2?.Text"></Display>
</div>
</div>
</DemoBlock>

<AttributeTable Items="@GetAttributes()" />

<EventTable Items="@GetEvents()" />
6 changes: 5 additions & 1 deletion src/BootstrapBlazor.Server/Components/Samples/Selects.razor.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,11 @@ public sealed partial class Selects
[NotNull]
private IStringLocalizer<Foo>? LocalizerFoo { get; set; }

private bool ShowSearch { get; set; }
private bool _showSearch;

private bool _isShowSearchClearable;

private bool _isClearable;

private string? _fooName;

Expand Down
2 changes: 1 addition & 1 deletion src/BootstrapBlazor/BootstrapBlazor.csproj
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<Project Sdk="Microsoft.NET.Sdk.Razor">

<PropertyGroup>
<Version>8.9.2-beta09</Version>
<Version>8.9.2-beta10</Version>
</PropertyGroup>

<ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">
Expand Down
4 changes: 2 additions & 2 deletions src/BootstrapBlazor/Components/Select/Select.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@
<i class="@SearchIconString"></i>
</div>
}
@foreach (var itemGroup in DataSource.GroupBy(i => i.GroupName))
@foreach (var itemGroup in _dataSource.GroupBy(i => i.GroupName))
{
if (!string.IsNullOrEmpty(itemGroup.Key))
{
Expand All @@ -81,7 +81,7 @@
@RenderRow(item)
}
}
@if (!DataSource.Any())
@if (!_dataSource.Any())
{
<div class="dropdown-item">@NoSearchDataText</div>
}
Expand Down
52 changes: 34 additions & 18 deletions src/BootstrapBlazor/Components/Select/Select.razor.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,13 +57,9 @@ public partial class Select<TValue> : ISelect
.AddClass("is-fixed", IsFixedSearch)
.Build();

/// <summary>
/// Razor 文件中 Options 模板子项
/// </summary>
private List<SelectedItem> Children { get; } = [];
private readonly List<SelectedItem> _children = [];

[NotNull]
private List<SelectedItem> DataSource { get; } = [];
private readonly List<SelectedItem> _dataSource = [];

/// <summary>
/// 获得/设置 右侧清除图标 默认 fa-solid fa-angle-up
Expand Down Expand Up @@ -270,7 +266,9 @@ protected override bool TryParseValueFromString(string value, [MaybeNullWhen(fal

private bool TryParseSelectItem(string value, [MaybeNullWhen(false)] out TValue result, out string? validationErrorMessage)
{
SelectedItem = (VirtualItems ?? DataSource).FirstOrDefault(i => i.Value == value) ?? GetVirtualizeItem();
SelectedItem = Items.FirstOrDefault(i => i.Value == value)
?? VirtualItems?.FirstOrDefault(i => i.Value == value)
?? GetVirtualizeItem();

// support SelectedItem? type
result = SelectedItem != null ? (TValue)(object)SelectedItem : default;
Expand All @@ -289,21 +287,21 @@ private bool TryParseSelectItem(string value, [MaybeNullWhen(false)] out TValue

private void ResetSelectedItem()
{
DataSource.Clear();
_dataSource.Clear();

if (string.IsNullOrEmpty(SearchText))
{
DataSource.AddRange(Items);
DataSource.AddRange(Children);
_dataSource.AddRange(Items);
_dataSource.AddRange(_children);

if (VirtualItems != null)
{
DataSource.AddRange(VirtualItems);
_dataSource.AddRange(VirtualItems);
}

SelectedItem = DataSource.Find(i => i.Value.Equals(CurrentValueAsString, StringComparison))
?? DataSource.Find(i => i.Active)
?? DataSource.Where(i => !i.IsDisabled).FirstOrDefault()
SelectedItem = _dataSource.Find(i => i.Value.Equals(CurrentValueAsString, StringComparison))
?? _dataSource.Find(i => i.Active)
?? _dataSource.Where(i => !i.IsDisabled).FirstOrDefault()
?? GetVirtualizeItem();

if (SelectedItem != null)
Expand All @@ -328,7 +326,7 @@ private void ResetSelectedItem()
}
else
{
DataSource.AddRange(OnSearchTextChanged(SearchText));
_dataSource.AddRange(OnSearchTextChanged(SearchText));
}
}

Expand All @@ -347,7 +345,7 @@ private void ResetSelectedItem()
public async Task ConfirmSelectedItem(int index)
{
var ds = string.IsNullOrEmpty(SearchText)
? DataSource
? _dataSource
: OnSearchTextChanged(SearchText);
var item = ds.ElementAt(index);
await OnClickItem(item);
Expand Down Expand Up @@ -415,7 +413,7 @@ private async Task SelectedItemChanged(SelectedItem item)
/// 添加静态下拉项方法
/// </summary>
/// <param name="item"></param>
public void Add(SelectedItem item) => Children.Add(item);
public void Add(SelectedItem item) => _children.Add(item);

/// <summary>
/// 清空搜索栏文本内容
Expand All @@ -433,7 +431,25 @@ private async Task OnClearValue()
await OnClearAsync();
}

var item = DataSource.FirstOrDefault();
SelectedItem? item;
if (IsVirtualize)
{
if (VirtualizeElement != null)
{
await VirtualizeElement.RefreshDataAsync();
item = VirtualItems!.FirstOrDefault();
}
else
{
VirtualItems = Items;
item = Items.FirstOrDefault();
}
}
else
{
item = Items.FirstOrDefault();
}

if (item != null)
{
await SelectedItemChanged(item);
Expand Down
Loading

0 comments on commit 7247d25

Please sign in to comment.