服务器端异步不是客户端异步
服务器端异步不会在 Web 浏览器中进行部分页面渲染。以下代码将阻塞直到GetItemsAsync返回。
public async Task<IViewComponentResult> InvokeAsync()
{
var items = await GetItemsAsync();
return View(items);
}
这段代码将阻塞，直到itemsTask完成。
public async Task<IViewComponentResult> InvokeAsync()
{
var itemsTask = GetItemsAsync(maxPriority, isDone);
// We can do some other work here,
// while the itemsTask is still running.
var items = await itemsTask;
return View(items);
}
服务器端异步让我们可以做额外的工作在服务器上当我们等待其他服务器端任务完成时。
AJAX 视图组件
要在 Web 浏览器中部分呈现页面，我们需要使用客户端 AJAX。在下面的例子中，我们使用AJAX来调用/Home/GetHelloWorld并渲染在body.
〜/HelloWorldViewComponent.cs
public class HelloWorldViewComponent : ViewComponent
{
public IViewComponentResult Invoke()
{
var model = new string[]
{
"Hello", "from", "the", "view", "component."
};
return View("Default", model);
}
}
〜/HomeController.cs
public class HomeController : Controller
{
public IActionResult GetHelloWorld()
{
return ViewComponent("HelloWorld");
}
}
〜/Views/Shared/Components/HelloWorld/Default.cshtml
@model string[]
<ul>
@foreach(var item in Model)
{
<li>@item</li>
}
</ul>
〜/wwwroot/index.html
<body>
<script src="js/jquery.min.js"></script>
<script>
$.get("home/GetHelloWorld", function(data) {
$("body").html(data);
});
</script>
</body>
本地主机:5000/index.html
