diff --git a/src/components/BootstrapBlazor.Region/BootstrapBlazor.Region.csproj b/src/components/BootstrapBlazor.Region/BootstrapBlazor.Region.csproj
index 9279e3a0..664f20b8 100644
--- a/src/components/BootstrapBlazor.Region/BootstrapBlazor.Region.csproj
+++ b/src/components/BootstrapBlazor.Region/BootstrapBlazor.Region.csproj
@@ -22,6 +22,7 @@
   </ItemGroup>
 
   <ItemGroup>
+    <Using Include="Microsoft.AspNetCore.Components" />
     <Using Include="Microsoft.JSInterop" />
   </ItemGroup>
 
diff --git a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor
index 69b3c48d..e6759b13 100644
--- a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor
+++ b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor
@@ -1,6 +1,6 @@
 @namespace BootstrapBlazor.Components
 @inherits PopoverSelectBase<string>
-@attribute [JSModuleAutoLoader("./_content/BootstrapBlazor.Region/Components/SelectRegion.razor.js", JSObjectReference = true)]
+@attribute [JSModuleAutoLoader("./_content/BootstrapBlazor.Region/Components/SelectRegion.razor.js")]
 
 @if (IsShowLabel)
 {
diff --git a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.cs b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.cs
index 274f9d68..ee63e0e2 100644
--- a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.cs
+++ b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.cs
@@ -2,8 +2,6 @@
 // Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
 // Website: https://www.blazor.zone or https://argozhang.github.io/
 
-using Microsoft.AspNetCore.Components;
-
 namespace BootstrapBlazor.Components;
 
 /// <summary>
@@ -177,11 +175,11 @@ private void ResetValue()
 
     private async Task OnClearValue()
     {
-        _provinceValue = "";
-        _cityValue = "";
+        _provinceValue = null;
+        _cityValue = null;
         _countyValue = new();
-        _detailValue = "";
-        CurrentValue = "";
+        _detailValue = null;
+        CurrentValue = null;
 
         _currentViewMode = RegionViewMode.Province;
 
@@ -226,6 +224,9 @@ private HashSet<string> GetDetails()
     private void OnClickProvince(string value)
     {
         _provinceValue = value;
+        _cityValue = null;
+        _countyValue = new();
+        _detailValue = null;
         _currentViewMode = RegionViewMode.City;
 
         CurrentValue = _provinceValue;
@@ -234,6 +235,8 @@ private void OnClickProvince(string value)
     private void OnClickCity(string value)
     {
         _cityValue = value;
+        _countyValue = new();
+        _detailValue = null;
         _currentViewMode = RegionViewMode.County;
 
         CurrentValue = $"{_provinceValue}-{_cityValue}";
@@ -242,6 +245,7 @@ private void OnClickCity(string value)
     private void OnClickCounty(CountyItem item)
     {
         _countyValue = item;
+        _detailValue = null;
         _currentViewMode = RegionViewMode.Detail;
 
         CurrentValue = $"{_provinceValue}-{_cityValue}-{_countyValue.Name}";
@@ -259,22 +263,16 @@ private async Task OnClickDetail(string value)
     private void OnSwitchProvinceView()
     {
         _currentViewMode = RegionViewMode.Province;
-        _cityValue = "";
-        _countyValue = new();
-        _detailValue = "";
     }
 
     private void OnSwitchCityView()
     {
         _currentViewMode = RegionViewMode.City;
-        _countyValue = new();
-        _detailValue = "";
     }
 
     private void OnSwitchCountyView()
     {
         _currentViewMode = RegionViewMode.County;
-        _detailValue = "";
     }
 
     private void OnSwitchDetailView()
diff --git a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.css b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.css
index ef0b2dea..bc73d85a 100644
--- a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.css
+++ b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.css
@@ -71,12 +71,12 @@
         color: #777;
     }
 
-        .bb-region-body ul li.active {
-            background-color: #e3e3e3;
+        .bb-region-body ul li:hover {
+            background-color: #e9ecef;
             color: #000;
         }
 
-        .bb-region-body ul li:hover {
+        .bb-region-body ul li.active {
             background-color: #e3e3e3;
             color: #000;
         }
diff --git a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.js b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.js
index ed5603a1..245d12fc 100644
--- a/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.js
+++ b/src/components/BootstrapBlazor.Region/Components/SelectRegion.razor.js
@@ -25,6 +25,6 @@ export function dispose(id) {
 
     const { popover } = region;
     if (popover) {
-        Popover.dispose(select.popover);
+        Popover.dispose(popover);
     }
 }