doc: 更新 Vditor 组件示例

Author: ArgoZhang

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

@@ -1,4 +1,4 @@
-@page "/vditors"
+@page "/vditor"
 @inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["VditorTitle"]</h3>
@@ -25,14 +25,14 @@
             </BootstrapInputGroup>
         </div>
         <div class="col-12">
-            <Button Text="GetValue" OnClick="OnTriggerGetValueAsync"></Button>
-            <Button Text="InsertValue" OnClick="OnTriggerInsertValueAsync"></Button>
-            <Button Text="GetHtml" OnClick="OnTriggerGetHtmlAsync"></Button>
-            <Button Text="GetSelection" OnClick="OnTriggerGetSelectionAsync"></Button>
-            <Button Text="Enable" OnClick="OnTriggerEnableAsync"></Button>
-            <Button Text="Disable" OnClick="OnTriggerDisableAsync"></Button>
-            <Button Text="Focus" OnClick="OnTriggerFocusAsync"></Button>
-            <Button Text="Blur" OnClick="OnTriggerBlurAsync"></Button>
+            <Button Text="GetValue" OnClick="OnTriggerGetValueAsync" IsDisabled="_isDisabled"></Button>
+            <Button Text="InsertValue" OnClick="OnTriggerInsertValueAsync" IsDisabled="_isDisabled"></Button>
+            <Button Text="GetHtml" OnClick="OnTriggerGetHtmlAsync" IsDisabled="_isDisabled"></Button>
+            <Button Text="GetSelection" OnClick="OnTriggerGetSelectionAsync" IsDisabled="_isDisabled"></Button>
+            <Button Text="Enable" OnClick="OnTriggerEnableAsync" IsDisabled="!_isDisabled"></Button>
+            <Button Text="Disable" OnClick="OnTriggerDisableAsync" IsDisabled="_isDisabled"></Button>
+            <Button Text="Focus" OnClick="OnTriggerFocusAsync" IsDisabled="_isDisabled"></Button>
+            <Button Text="Blur" OnClick="OnTriggerBlurAsync" IsDisabled="_isDisabled"></Button>
         </div>
     </section>
     <Vditor Value="@_vditorValueString" Options="_vditorOptions" @ref="_vditor"

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

@@ -118,14 +118,17 @@ private async Task OnTriggerGetSelectionAsync()
         _logger.Log($"Trigger OnTriggerGetSelectionAsync: {selection}");
     }
 
+    private bool _isDisabled = false;
     private async Task OnTriggerEnableAsync()
     {
         await _vditor.EnableAsync();
+        _isDisabled = false;
     }
 
     private async Task OnTriggerDisableAsync()
     {
         await _vditor.DisableAsync();
+        _isDisabled = true;
     }
 
     private async Task OnTriggerFocusAsync()

src/BootstrapBlazor.Server/Extensions/MenusLocalizerExtensions.cs

@@ -521,7 +521,7 @@ void AddForm(DemoMenuItem item)
                 {
                     IsNew = true,
                     Text = Localizer["Vditor"],
-                    Url = "vditors"
+                    Url = "vditor"
                 }
             };
             AddBadge(item);

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

@@ -7191,5 +7191,11 @@
     "AudioDevicePauseText": "Pause",
     "AudioDeviceResumeText": "Resume",
     "AudioDeviceDownloadText": "Download"
+  },
+  "BootstrapBlazor.Server.Components.Samples.Vditors": {
+    "VditorTitle": "Vditor Markdown",
+    "VditorSubTitle": "Vditor is a browser-based Markdown editor that supports WYSIWYG, instant rendering (similar to Typora), and split-screen preview mode.",
+    "BaseUsageTitle": "Basic usage",
+    "BaseUsageIntro": "Set the content displayed by the component by setting the <code>Value</code> value, and set the component configuration information by setting the <code>Options</code> parameter"
   }
 }

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

@@ -7191,5 +7191,11 @@
     "AudioDevicePauseText": "暂停",
     "AudioDeviceResumeText": "恢复",
     "AudioDeviceDownloadText": "下载"
+  },
+  "BootstrapBlazor.Server.Components.Samples.Vditors": {
+    "VditorTitle": "Vditor Markdown 富文本编辑框",
+    "VditorSubTitle": "Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式",
+    "BaseUsageTitle": "基本用法",
+    "BaseUsageIntro": "通过设置 <code>Value</code> 值设置组件显示的内容，通过 <code>Options</code> 参数设置组件配置信息"
   }
 }