fix(Search): network delay causes input lag

src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor

@@ -16,7 +16,9 @@
            placeholder="@PlaceHolder" disabled="@Disabled" @ref="FocusElement"/>
     <span class="form-select-append"><i class="@Icon"></i></span>
     <span class="form-select-append ac-loading"><i class="@LoadingIcon"></i></span>
-    <RenderTemplate ChildContent="RenderItems"></RenderTemplate>
+    <BootstrapBlazorRender @ref="_dropdown">
+        @RenderDropdown
+    </BootstrapBlazorRender>
 </div>
 
 @code {

src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.cs

@@ -90,7 +90,7 @@ public partial class AutoComplete
     private List<string>? _filterItems;
 
     [NotNull]
-    private AutoCompleteItems? _dropdown = default;
+    private BootstrapBlazorRender? _dropdown = default;
 
     /// <summary>
     /// <inheritdoc/>
@@ -187,15 +187,7 @@ public override Task TriggerChange(string val)
             StateHasChanged();
         }
         _render = true;
-        _dropdown.RenderContent();
+        _dropdown.Render();
         return Task.CompletedTask;
     }
-
-    private RenderFragment RenderItems => builder =>
-    {
-        builder.OpenComponent<AutoCompleteItems>(0);
-        builder.AddAttribute(10, "ChildContent", RenderDropdown);
-        builder.AddComponentReferenceCapture(20, dropdown => _dropdown = (AutoCompleteItems)dropdown);
-        builder.CloseComponent();
-    };
 }

src/BootstrapBlazor/Components/AutoComplete/AutoCompleteItems.cs → src/BootstrapBlazor/Components/BaseComponents/BootstrapBlazorRender.cs

@@ -8,16 +8,18 @@
 namespace BootstrapBlazor.Components;
 
 /// <summary>
-/// AutoCompleteItems component
+/// BootstrapBlazorRender component
 /// </summary>
-class AutoCompleteItems : IComponent
+public class BootstrapBlazorRender : IComponent
 {
     /// <summary>
     /// Gets or sets the child content
     /// </summary>
     [Parameter, NotNull]
     public RenderFragment? ChildContent { get; set; }
 
+    private static readonly RenderFragment _emptyRenderFragment = _ => { };
+
     private RenderHandle _renderHandle;
 
     /// <summary>
@@ -38,23 +40,19 @@
     {
         parameters.SetParameterProperties(this);
 
-        RenderContent();
+        Render();
         return Task.CompletedTask;
     }
     /// <summary>
     /// Render method
     /// </summary>
-    public void RenderContent()
+    public void Render()
     {
         _renderHandle.Render(BuildRenderTree);
     }
 
-    /// <summary>
-    /// <inheritdoc/>
-    /// </summary>
-    /// <param name="builder"></param>
     private void BuildRenderTree(RenderTreeBuilder builder)
     {
-        builder.AddContent(0, ChildContent);
+        builder.AddContent(0, ChildContent ?? _emptyRenderFragment);
     }
 }

src/BootstrapBlazor/Components/Search/Search.razor

@@ -55,7 +55,14 @@
             <Button Color="SearchButtonColor" Text="@SearchButtonText" Icon="@ButtonIcon" OnClick="OnSearchClick" aria-label="Search"></Button>
         }
     </div>
-    <ul class="dropdown-menu">
+    <BootstrapBlazorRender @ref="_dropdown">
+        @RenderDropdown
+    </BootstrapBlazorRender>
+</div>
+
+@code {
+    RenderFragment RenderDropdown =>
+    @<ul class="dropdown-menu">
         @foreach (var item in _filterItems)
         {
             <li class="dropdown-item" @onclick="() => OnClickItem(item)">
@@ -73,5 +80,5 @@
         {
             <li class="dropdown-item">@NoDataTip</li>
         }
-    </ul>
-</div>
+    </ul>;
+}

src/BootstrapBlazor/Components/Search/Search.razor.cs

@@ -171,6 +171,9 @@ public partial class Search<TValue>
 
     private SearchContext<TValue> _context = default!;
 
+    [NotNull]
+    private BootstrapBlazorRender? _dropdown = default;
+
     /// <summary>
     /// <inheritdoc/>
     /// </summary>
@@ -205,6 +208,14 @@ protected override void OnParametersSet()
         }
     }
 
+    private bool _render = true;
+
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    /// <returns></returns>
+    protected override bool ShouldRender() => _render;
+
     private string _displayText = "";
     /// <summary>
     /// 点击搜索按钮时触发此方法
@@ -280,11 +291,13 @@ private async Task OnClickItem(TValue val)
     [JSInvokable]
     public override async Task TriggerChange(string val)
     {
+        _render = false;
         _displayText = val;
-
         if (IsTriggerSearchByInput)
         {
             await OnSearchClick();
         }
+        _render = true;
+        _dropdown.Render();
     }
 }