Blazor访问WebApi基础及Blazor刷新问题

一个小demo。

webapi跨域问题，参见VS2019下开发和调用webapi

webapi

代码：

[Route("api/[controller]/[action]")]
    [ApiController]
    public class ValuesController : ControllerBase
    {
        public string Index()
        {
            return "Hello Katty.";
        }
        [HttpGet("{x}")]
        public string Index1(string x)
        {
            return x + ",Hello Katty.";
        }
    }

blazor

program.cs:

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");

builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri("http://localhost:5014/") });

await builder.Build().RunAsync();

修改了第6行，仅修改了webapi服务器地址。这一行说明httpclient是作用域注入（这里相当于单例）。

index.razor:

@page "/"
@inject HttpClient Http

用户名：<input @bind=u />密码：<input @bind=p /><br />
结果：@msg<br />
<button @onclick="Sub">提交</button>
@code {
    private string u=string.Empty;
    private string p=string.Empty;
    private string msg="提示";
    int c = 1;

    private async void Sub()
    {
        msg=await Http.GetStringAsync($"/api/values/index1/{c}");
        c++;
        StateHasChanged();
    }
}

第2行，注入。代码里可以用Http表示单例的HttpClient。

第17行的StateHasChanged();用于强制刷新，此处强制刷新第5行处。