Blazor

Question

已经在这里待了两天了。有很多类似的问题，但 none 的答案对我来说很成功。我来自在控制器端使用 C#，在 ASP.NET Core 中对客户端的所有客户端使用纯 JavaScript。我对 .NET 环境很熟悉，但对 Blazor 很吃力。

问题：要开始使用 Blazor，我要做的第一件事是设置一个非常简单的视图（剃须刀页面，因为这是 Blazor）。单击按钮时，我从控制器调用 HttpGet - 我可以在浏览器调试（网络选项卡）中验证调用是否通过，并且返回了一个 Notes 对象，其中包含我在控制器中给它的值。我有这个代码作为我的剃刀页面：

<div class="row">
    <div class="col-md-3">
        <input class="form-control" placeholder="Insert Random Value" @bind="@theResponse.note1" />
    </div>
    <div class="col-md-1">
        <button class="btn btn-warning" @onclick="TestPost">Test POST</button>
    </div>
</div>



@code {

    Notes theResponse = new Notes();

    private async Task TestPost()
    {
        theResponse = await Http.GetFromJsonAsync<Notes>("Test/Action4");
    }


}

备注对象：

    public class Notes
    {
        public string note1 { get; set; }
    }

控制器：

namespace BlazorTry1.Server.Controllers
{
    [ApiController]
    [Route("[controller]")]
    public class TestController : Controller
    {
        [HttpGet]
        [Route("[action]")]
        [ActionName("Action4")]
        public async Task<JsonResult> myStringResult1()
        {
            Notes myNotes = new Notes();
            myNotes.note1 = "YouHitTheGetRequest";
            var yourdata = myNotes;
            return Json(new { data = yourdata });
        }
    }
}

但是，在 Visual Studio 中进行调试 - 'theResponse' 通过逐步调试仍然为空。

我在 Whosebug 上阅读的其他答案证实，在当前的 Blazor 中，StateHasChanged 在任务方法结束时自动调用。我试过手动添加，当然没有变化。

我确定我在这里遗漏了一些非常明显的东西 - 但我在剃须刀页面上尝试了很多不同的想法，但我没有成功。我读了@bind

The @bind attribute accomplishes two separate (but related) tasks:

Binds an expression to the value of the <Input... component

Binds a delegate that will trigger the component's ValueChanged property

我确定我的解释是错误的，但我想象当 Notes 对象发生属性更改时，会触发 ValueChanged 事件。

编辑：已编辑以更正语法。

Answer 1

问题出在你的控制器上更换这个

  public async Task<JsonResult> myStringResult1()
        {
            Notes myNotes = new Notes();
            myNotes.note1 = "YouHitTheGetRequest";
            var yourdata = myNotes;
            return Json(new { data = yourdata });
        }

有了这个

 public async Task<ActionResult<Notes>> myStringResult1()
        {
            Notes myNotes = new Notes();
            myNotes.note1 = "YouHitTheGetRequest";
            return myNotes; 
        }

Blazor - 在异步获取请求后单击按钮时更新 HTML

Blazor - update HTML on button click following async get request

c#

asp.net

webassembly

.net-5