mirror of
https://gitee.com/LongbowEnterprise/BootstrapBlazor.git
synced 2024-12-05 13:39:39 +08:00
!3649 doc(#I677HQ): update Ajax demo
* doc: 更新 AjaxGoto 文档 * refactor: 重构代码精简 CacheManager 内部逻辑 * refactor: 增加多语言替换功能 * doc: 格式化文档 * revert: 增加示例 * doc: 增加本地化 * Merge branch 'main' into doc/newAjax * update ajax demos
This commit is contained in:
parent
0ac3c3739f
commit
056f1031ca
22
src/BootstrapBlazor.Shared/Demos/Ajax/AjaxGoto.razor
Normal file
22
src/BootstrapBlazor.Shared/Demos/Ajax/AjaxGoto.razor
Normal file
@ -0,0 +1,22 @@
|
||||
<Button OnClick="Goto">@Localizer["GotoButtonText1"]</Button>
|
||||
<Button OnClick="GotoSelf">@Localizer["GotoButtonText2"]</Button>
|
||||
|
||||
@code {
|
||||
[Inject]
|
||||
[NotNull]
|
||||
private IStringLocalizer<AjaxGoto>? Localizer { get; set; }
|
||||
|
||||
[Inject]
|
||||
[NotNull]
|
||||
private AjaxService? AjaxService { get; set; }
|
||||
|
||||
private async Task Goto()
|
||||
{
|
||||
await AjaxService.Goto("/introduction");
|
||||
}
|
||||
|
||||
private async Task GotoSelf()
|
||||
{
|
||||
await AjaxService.Goto("/ajaxs");
|
||||
}
|
||||
}
|
@ -1,19 +1,23 @@
|
||||
@using BootstrapBlazor.Components
|
||||
@using System.Text.Json
|
||||
|
||||
<div class="my-2">
|
||||
<b>特别注意:</b>
|
||||
<div class="mt-3">
|
||||
<Button OnClick="Success">@Localizer["NormalButtonText1"]</Button>
|
||||
<Button OnClick="Fail">@Localizer["NormalButtonText2"]</Button>
|
||||
@if (!string.IsNullOrEmpty(ResultMessage))
|
||||
{
|
||||
<div class="mt-2"><code>@ResultMessage</code></div>
|
||||
}
|
||||
</div>
|
||||
<div>这里只是进行了登录模拟,并没有真正的调用 <code>HttpContext.SignInAsync</code>,真实使用时需要在登录完成后对页面进行刷新,否则无法真正的登录成功。</div>
|
||||
|
||||
<div class="mb-3"><code>@ResultMessage</code></div>
|
||||
<Button OnClick="Success">登录成功</Button>
|
||||
<Button OnClick="Fail">登录失败</Button>
|
||||
|
||||
@code
|
||||
{
|
||||
private string? ResultMessage { get; set; }
|
||||
|
||||
[Inject]
|
||||
[NotNull]
|
||||
private IStringLocalizer<AjaxNormal>? Localizer { get; set; }
|
||||
|
||||
[Inject]
|
||||
[NotNull]
|
||||
private AjaxService? AjaxService { get; set; }
|
||||
@ -22,17 +26,21 @@
|
||||
[NotNull]
|
||||
private SwalService? SwalService { get; set; }
|
||||
|
||||
private async Task Success()
|
||||
private Task Success() => ProcessResponse("admin", "123456");
|
||||
|
||||
private Task Fail() => ProcessResponse("admin", "123");
|
||||
|
||||
private async Task ProcessResponse(string userName, string password)
|
||||
{
|
||||
var option = new AjaxOption
|
||||
var option = new AjaxOption()
|
||||
{
|
||||
Url = "/api/Login",
|
||||
Data = new User() { UserName = "admin", Password = "123456" }
|
||||
Data = new User() { UserName = userName, Password = password }
|
||||
};
|
||||
var result = await AjaxService.InvokeAsync(option);
|
||||
if (result == null)
|
||||
{
|
||||
ResultMessage = "响应失败";
|
||||
ResultMessage = "Login failed";
|
||||
}
|
||||
else
|
||||
{
|
||||
@ -40,55 +48,19 @@
|
||||
var doc = JsonDocument.Parse(result);
|
||||
if (200 == doc.RootElement.GetProperty("code").GetInt32())
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = "登录成功!", Category = SwalCategory.Success });
|
||||
await SwalService.Show(new SwalOption() { Content = "Login success!", Category = SwalCategory.Success });
|
||||
}
|
||||
else
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = $"登录失败:{doc.RootElement.GetProperty("message").GetString()}", Category = SwalCategory.Error });
|
||||
await SwalService.Show(new SwalOption() { Content = $"Login failed: {doc.RootElement.GetProperty("message").GetString()}", Category = SwalCategory.Error });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private async Task Fail()
|
||||
{
|
||||
var option = new AjaxOption
|
||||
{
|
||||
Url = "/api/Login",
|
||||
Data = new User() { UserName = "admin", Password = "1234567" }
|
||||
};
|
||||
var result = await AjaxService.InvokeAsync(option);
|
||||
if (result == null)
|
||||
{
|
||||
ResultMessage = "响应失败";
|
||||
}
|
||||
else
|
||||
{
|
||||
ResultMessage = result;
|
||||
var doc = JsonDocument.Parse(result);
|
||||
if (200 == doc.RootElement.GetProperty("code").GetInt32())
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = "登录成功!", Category = SwalCategory.Success });
|
||||
}
|
||||
else
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = $"登录失败:{doc.RootElement.GetProperty("message").GetString()}", Category = SwalCategory.Error });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 登录模拟类
|
||||
/// </summary>
|
||||
class User
|
||||
{
|
||||
/// <summary>
|
||||
/// 用户名
|
||||
/// </summary>
|
||||
public string? UserName { get; set; }
|
||||
|
||||
/// <summary>
|
||||
/// 密码
|
||||
/// </summary>
|
||||
public string? Password { get; set; }
|
||||
}
|
||||
}
|
||||
|
@ -35,16 +35,16 @@ internal static class CacheManagerExtensions
|
||||
/// 获得 指定代码文件当前文化设置的本地化资源集合
|
||||
/// </summary>
|
||||
/// <param name="cache"></param>
|
||||
/// <param name="codeFile"></param>
|
||||
/// <param name="typeName"></param>
|
||||
/// <param name="options"></param>
|
||||
/// <returns></returns>
|
||||
public static IEnumerable<LocalizedString> GetDemoLocalizedStrings(this ICacheManager cache, string codeFile, JsonLocalizationOptions options)
|
||||
public static IEnumerable<LocalizedString> GetDemoLocalizedStrings(this ICacheManager cache, string typeName, JsonLocalizationOptions options)
|
||||
{
|
||||
var key = $"Snippet-{CultureInfo.CurrentUICulture.Name}-{nameof(GetLocalizedStrings)}-{codeFile}";
|
||||
return cache.GetOrCreate(key, entry =>
|
||||
var key = $"Snippet-{CultureInfo.CurrentUICulture.Name}-{nameof(GetLocalizedStrings)}-{typeName}";
|
||||
return cache.GetOrCreate(key, (Func<ICacheEntry, IEnumerable<LocalizedString>>)(entry =>
|
||||
{
|
||||
return Utility.GetJsonStringByTypeName(options, typeof(CodeSnippetService).Assembly, $"BootstrapBlazor.Shared.{codeFile}");
|
||||
});
|
||||
return Utility.GetJsonStringByTypeName(options, typeof(CodeSnippetService).Assembly, $"BootstrapBlazor.Shared.Demos.{typeName}");
|
||||
}));
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
|
@ -3253,20 +3253,24 @@
|
||||
},
|
||||
"BootstrapBlazor.Shared.Samples.Ajaxs": {
|
||||
"AjaxTitle": "Ajax call",
|
||||
"H4": "The ajax method used to use js directly in the browser to interact with the server currently only supports both input and output as json, and the return value is a json string, which can be converted and processed by itself.",
|
||||
"AjaxDescribe": "The ajax method used to use js directly in the browser to interact with the server currently only supports both input and output as json, and the return value is a json string, which can be converted and processed by itself.",
|
||||
"NormalTitle": "Basic usage",
|
||||
"NormalIntro": "Impersonate a login",
|
||||
"NormalB": "Special attention:",
|
||||
"NormalDiv": "Here is only a login simulation, and there is no real call to<code> HttpContext.SignInAsync </code>, the real use needs to refresh the page after the login is completed, otherwise the real login can not be successful.",
|
||||
"NormalButtonText1": "Login successful",
|
||||
"NormalButtonText2": "Login failed",
|
||||
"GotoTitle": "Page jump",
|
||||
"GotoIntro": "Implementing page jumps with<code> Js </code> addresses an issue where <code> Blazor </code> pages don't really refresh when they're jumped as <b> SPA </b>",
|
||||
"GotoButtonText1": "Jump to the first page of the document",
|
||||
"GotoButtonText2": "Jump to yourself (refresh page)",
|
||||
"InvokeAsync": "Execute fetch",
|
||||
"Goto": "Execute goto"
|
||||
},
|
||||
"BootstrapBlazor.Shared.Demos.Ajax.AjaxNormal": {
|
||||
"NormalButtonText1": "Login successful",
|
||||
"NormalButtonText2": "Login failed"
|
||||
},
|
||||
"BootstrapBlazor.Shared.Demos.Ajax.AjaxGoto": {
|
||||
"GotoButtonText1": "Jump to the first page of the document",
|
||||
"GotoButtonText2": "Jump to yourself (refresh page)"
|
||||
},
|
||||
"BootstrapBlazor.Shared.Samples.Avatars": {
|
||||
"Title": "Avatar",
|
||||
"SubTitle": "Present user or thing information as icons, pictures, or characters.",
|
||||
|
@ -3261,20 +3261,24 @@
|
||||
},
|
||||
"BootstrapBlazor.Shared.Samples.Ajaxs": {
|
||||
"AjaxTitle": "Ajax调用",
|
||||
"H4": "用于直接在浏览器使用 fetch 方法与服务器交互,目前只支持输入输出皆为 json,返回值为 json 字符串,可以自行转换处理。",
|
||||
"AjaxDescribe": "用于直接在浏览器使用 fetch 方法与服务器交互,目前只支持输入输出皆为 json,返回值为 json 字符串,可以自行转换处理。",
|
||||
"NormalTitle": "基础用法",
|
||||
"NormalIntro": "模拟登录",
|
||||
"NormalB": "特别注意:",
|
||||
"NormalDiv": "这里只是进行了登录模拟,并没有真正的调用 <code>HttpContext.SignInAsync</code>,真实使用时需要在登录完成后对页面进行刷新,否则无法真正的登录成功。",
|
||||
"NormalButtonText1": "登录成功",
|
||||
"NormalButtonText2": "登录失败",
|
||||
"GotoTitle": "页面跳转",
|
||||
"GotoIntro": "用 <code>Js</code> 实现页面跳转,解决了 <code>Blazor</code> 页面作为 <b>SPA</b> 跳转时不会真正刷新页面的问题",
|
||||
"GotoButtonText1": "跳转到文档首页",
|
||||
"GotoButtonText2": "跳转到自己(刷新页面)",
|
||||
"InvokeAsync": "执行 fetch 方法",
|
||||
"Goto": "执行 goto 方法"
|
||||
},
|
||||
"BootstrapBlazor.Shared.Demos.Ajax.AjaxNormal": {
|
||||
"NormalButtonText1": "登录成功",
|
||||
"NormalButtonText2": "登录失败"
|
||||
},
|
||||
"BootstrapBlazor.Shared.Demos.Ajax.AjaxGoto": {
|
||||
"GotoButtonText1": "跳转到文档首页",
|
||||
"GotoButtonText2": "跳转到自己(刷新页面)"
|
||||
},
|
||||
"BootstrapBlazor.Shared.Samples.Avatars": {
|
||||
"Title": "Avatar 头像",
|
||||
"SubTitle": "用图标、图片或者字符的形式展示用户或事物信息。",
|
||||
|
@ -3,7 +3,7 @@
|
||||
|
||||
<h3>@Localizer["AjaxTitle"]</h3>
|
||||
|
||||
<h4>@Localizer["H4"]</h4>
|
||||
<h4>@Localizer["AjaxDescribe"]</h4>
|
||||
|
||||
<DemoBlock Introduction="@Localizer["NormalIntro"]" Title="@Localizer["NormalTitle"]" Name="Normal" Demo="Ajax.AjaxNormal">
|
||||
<p>
|
||||
@ -18,10 +18,31 @@
|
||||
var result = await AjaxService.InvokeAsync(option);</Pre>
|
||||
</DemoBlock>
|
||||
|
||||
<DemoBlock Introduction="@Localizer["GotoIntro"]" Title="@Localizer["GotoTitle"]" Name="Goto">
|
||||
<Pre>await AjaxService.Goto("/introduction");</Pre>
|
||||
<Button OnClick="Goto">@Localizer["GotoButtonText1"]</Button>
|
||||
<Button OnClick="GotoSelf">@Localizer["GotoButtonText2"]</Button>
|
||||
</DemoBlock>
|
||||
<DemoBlock Introduction="@Localizer["GotoIntro"]" Title="@Localizer["GotoTitle"]" Name="Goto" Demo="Ajax.AjaxGoto" />
|
||||
|
||||
<MethodTable Items="@GetMethods()" />
|
||||
|
||||
@code
|
||||
{
|
||||
/// <summary>
|
||||
/// 获得属性方法
|
||||
/// </summary>
|
||||
/// <returns></returns>
|
||||
private IEnumerable<MethodItem> GetMethods() => new MethodItem[]
|
||||
{
|
||||
new MethodItem()
|
||||
{
|
||||
Name = "InvokeAsync",
|
||||
Description = Localizer["InvokeAsync"],
|
||||
Parameters = "AjaxOption",
|
||||
ReturnValue = "string"
|
||||
},
|
||||
new MethodItem()
|
||||
{
|
||||
Name = "Goto",
|
||||
Description = Localizer["Goto"],
|
||||
Parameters = "string",
|
||||
ReturnValue = " — "
|
||||
}
|
||||
};
|
||||
}
|
||||
|
@ -1,109 +0,0 @@
|
||||
// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
|
||||
// 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 System.Text.Json;
|
||||
|
||||
namespace BootstrapBlazor.Shared.Samples;
|
||||
|
||||
/// <summary>
|
||||
/// Ajax示例类
|
||||
/// </summary>
|
||||
public partial class Ajaxs
|
||||
{
|
||||
private string? ResultMessage { get; set; }
|
||||
|
||||
[Inject]
|
||||
[NotNull]
|
||||
private AjaxService? AjaxService { get; set; }
|
||||
|
||||
[Inject]
|
||||
[NotNull]
|
||||
private SwalService? SwalService { get; set; }
|
||||
|
||||
private async Task Success()
|
||||
{
|
||||
var option = new AjaxOption
|
||||
{
|
||||
Url = "/api/Login",
|
||||
Data = new User() { UserName = "admin", Password = "123456" }
|
||||
};
|
||||
var result = await AjaxService.InvokeAsync(option);
|
||||
if (result == null)
|
||||
{
|
||||
ResultMessage = "响应失败";
|
||||
}
|
||||
else
|
||||
{
|
||||
ResultMessage = result;
|
||||
var doc = JsonDocument.Parse(result);
|
||||
if (200 == doc.RootElement.GetProperty("code").GetInt32())
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = "登录成功!", Category = SwalCategory.Success });
|
||||
}
|
||||
else
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = $"登录失败:{doc.RootElement.GetProperty("message").GetString()}", Category = SwalCategory.Error });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private async Task Fail()
|
||||
{
|
||||
var option = new AjaxOption
|
||||
{
|
||||
Url = "/api/Login",
|
||||
Data = new User() { UserName = "admin", Password = "1234567" }
|
||||
};
|
||||
var result = await AjaxService.InvokeAsync(option);
|
||||
if (result == null)
|
||||
{
|
||||
ResultMessage = "响应失败";
|
||||
}
|
||||
else
|
||||
{
|
||||
ResultMessage = result;
|
||||
var doc = JsonDocument.Parse(result);
|
||||
if (200 == doc.RootElement.GetProperty("code").GetInt32())
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = "登录成功!", Category = SwalCategory.Success });
|
||||
}
|
||||
else
|
||||
{
|
||||
await SwalService.Show(new SwalOption() { Content = $"登录失败:{doc.RootElement.GetProperty("message").GetString()}", Category = SwalCategory.Error });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private async Task Goto()
|
||||
{
|
||||
await AjaxService.Goto("/introduction");
|
||||
}
|
||||
|
||||
private async Task GotoSelf()
|
||||
{
|
||||
await AjaxService.Goto("/ajaxs");
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 获得属性方法
|
||||
/// </summary>
|
||||
/// <returns></returns>
|
||||
private IEnumerable<MethodItem> GetMethods() => new MethodItem[]
|
||||
{
|
||||
new MethodItem()
|
||||
{
|
||||
Name = "InvokeAsync",
|
||||
Description = Localizer["InvokeAsync"],
|
||||
Parameters = "AjaxOption",
|
||||
ReturnValue = "string"
|
||||
},
|
||||
new MethodItem()
|
||||
{
|
||||
Name = "Goto",
|
||||
Description = Localizer["Goto"],
|
||||
Parameters = "string",
|
||||
ReturnValue = " — "
|
||||
}
|
||||
};
|
||||
}
|
@ -146,12 +146,12 @@ class CodeSnippetService
|
||||
{
|
||||
var payload = "";
|
||||
|
||||
demo = demo.Replace('.', Path.DirectorySeparatorChar);
|
||||
demo = $"{demo}.razor";
|
||||
var fileName = demo.Replace('.', Path.DirectorySeparatorChar);
|
||||
fileName = $"{fileName}.razor";
|
||||
|
||||
if (IsDevelopment)
|
||||
{
|
||||
payload = await ReadDemoTextAsync(demo);
|
||||
payload = await ReadDemoTextAsync(fileName);
|
||||
}
|
||||
else
|
||||
{
|
||||
@ -161,12 +161,12 @@ class CodeSnippetService
|
||||
if (OperatingSystem.IsBrowser())
|
||||
{
|
||||
client.BaseAddress = new Uri($"{ServerUrl}/api/");
|
||||
payload = await client.GetStringAsync($"Code?fileName={demo}");
|
||||
payload = await client.GetStringAsync($"Code?fileName={fileName}");
|
||||
}
|
||||
else
|
||||
{
|
||||
client.BaseAddress = new Uri(DemoUrl);
|
||||
payload = await client.GetStringAsync(demo.Replace('\\', '/'));
|
||||
payload = await client.GetStringAsync(fileName.Replace('\\', '/'));
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user