doc: 更新示例

Author: ArgoZhang

src/BootstrapBlazor.Server/Components/Samples/Selects.razor

@@ -338,12 +338,21 @@
 <DemoBlock Title="@Localizer["SelectsClearableTitle"]"
            Introduction="@Localizer["SelectsClearableIntro"]"
            Name="IsClearable">
+    <section ignore>
+        <p>@((MarkupString)Localizer["SelectsClearableDesc"].Value)</p>
+    </section>
     <div class="row g-3">
         <div class="col-12 col-sm-6">
-            <Select Color="Color.Primary" IsClearable="true" Items="ClearableItems" Value="ClearableModel.Name"></Select>
+            <Select IsClearable="true" Items="ClearableItems" Value="ClearableModel.NullableName" ShowLabel="true" DisplayText="string?"></Select>
+        </div>
+        <div class="col-12 col-sm-6">
+            <Select IsClearable="true" Items="Items" Value="ClearableModel.Name" ShowLabel="true" DisplayText="string"></Select>
+        </div>
+        <div class="col-12 col-sm-6">
+            <Select IsClearable="true" Items="IntItems" Value="ClearableModel.NullableCount" ShowLabel="true" DisplayText="int?"></Select>
         </div>
         <div class="col-12 col-sm-6">
-            <Select Color="Color.Primary" IsClearable="true" Items="Items" Value="ClearableModel.Name"></Select>
+            <Select IsClearable="true" Items="IntItems" Value="ClearableModel.Count" ShowLabel="true" DisplayText="int"></Select>
         </div>
     </div>
 </DemoBlock>

src/BootstrapBlazor.Server/Components/Samples/Selects.razor.cs

@@ -101,7 +101,18 @@ private Task OnItemChanged(SelectedItem item)
 
     private Foo BindingModel { get; set; } = new Foo();
 
-    private Foo ClearableModel { get; set; } = new Foo();
+    private MockModel ClearableModel { get; set; } = new();
+
+    class MockModel
+    {
+        public string? NullableName { get; set; }
+
+        public string Name { get; set; } = "";
+
+        public int Count { get; set; } = 1;
+
+        public int? NullableCount { get; set; }
+    }
 
     private SelectedItem? Item { get; set; }
 
@@ -230,6 +241,14 @@ private string GetSelectedBoolItemString()
         new("abcde", "abcde")
     ];
 
+    private readonly SelectedItem[] IntItems =
+    [
+        new("1", "1"),
+        new("12", "12"),
+        new("123", "123"),
+        new("1234", "1234")
+    ];
+
     private static Task<bool> OnBeforeSelectedItemChange(SelectedItem item)
     {
         return Task.FromResult(true);

src/BootstrapBlazor.Server/Locales/en-US.json

@@ -3111,6 +3111,7 @@
     "SelectsBindingIntro": "The values in the text box change as you change the drop-down option by binding the <code>Model.Name</code> property to the component with <code>Select</code>",
     "SelectsClearableTitle": "Clearable",
     "SelectsClearableIntro": "You can clear Select using a clear icon",
+    "SelectsClearableDesc": "Cannot be a null integer. Setting <code>IsClearable</code> has no effect. Its default value is <b>0</b>",
     "SelectsBindingSelectedItemTitle": "Select two-way binding SelectItem type",
     "SelectsBindingSelectedItemIntro": "The values in the text box change as you change the drop-down option by binding the <code>SelectItem</code> property to the component with <code>Select</code> .",
     "SelectsCascadingTitle": "Select cascading binding",

src/BootstrapBlazor.Server/Locales/zh-CN.json

@@ -3111,6 +3111,7 @@
     "SelectsBindingIntro": "通过 <code>Select</code> 组件绑定 <code>Model.Name</code> 属性，改变下拉框选项时，文本框内的数值随之改变。",
     "SelectsClearableTitle": "可清空单选",
     "SelectsClearableIntro": "包含清空按钮，可将选择器清空为初始状态",
+    "SelectsClearableDesc": "不可为空整形设置 <code>IsClearable</code> 无效，其默认值为 <b>0</b>",
     "SelectsBindingSelectedItemTitle": "Select 双向绑定 SelectItem",
     "SelectsBindingSelectedItemIntro": "通过 <code>Select</code> 组件绑定 <code>SelectItem</code> 属性，改变下拉框选项时，文本框内的数值随之改变。",
     "SelectsCascadingTitle": "Select 级联绑定",