C# ViewComponents不是异步的
我试图使用C# ViewComponents不是异步的,c#,asp.net-core,asp.net-core-mvc,asp.net-core-viewcomponent,C#,Asp.net Core,Asp.net Core Mvc,Asp.net Core Viewcomponent,我试图使用ViewComponents.InvokeAsync()功能,但不知何故,这根本不是异步的。它正在等待组件代码呈现。 我的代码与上面示例中解释的代码非常相似。我使用的是在MVC6中创建新应用程序时出现的布局页面 我认为ViewComponent.InvokeAsync()方法将相对于主页异步呈现。但事实并非如此。为了实现这一点,我们需要使用AJAX。服务器端异步不是客户端异步 服务器端异步不会在web浏览器中进行部分页面呈现。以下代码将被阻止,直到GetItemsAsync返回 pu
ViewComponents.InvokeAsync()
功能,但不知何故,这根本不是异步的。它正在等待组件代码呈现。
我的代码与上面示例中解释的代码非常相似。我使用的是在MVC6中创建新应用程序时出现的布局页面
我认为ViewComponent.InvokeAsync()
方法将相对于主页异步呈现。但事实并非如此。为了实现这一点,我们需要使用AJAX。服务器端异步不是客户端异步
服务器端异步不会在web浏览器中进行部分页面呈现。以下代码将被阻止,直到GetItemsAsync
返回
public async Task<IViewComponentResult> InvokeAsync()
{
var items = await GetItemsAsync();
return View(items);
}
服务器端异步允许我们在等待其他服务器端任务完成时在服务器上执行其他工作
AJAX视图组件
要在web浏览器中部分呈现页面,我们需要使用客户端AJAX。在下面的示例中,我们使用AJAX调用/Home/GetHelloWorld
,并在主体中进行渲染
~/HelloWorldViewComponent.cs
public class HelloWorldViewComponent : ViewComponent
{
public IViewComponentResult Invoke()
{
var model = new string[]
{
"Hello", "from", "the", "view", "component."
};
return View("Default", model);
}
}
public class HomeController : Controller
{
public IActionResult GetHelloWorld()
{
return ViewComponent("HelloWorld");
}
}
~/HomeController.cs
public class HelloWorldViewComponent : ViewComponent
{
public IViewComponentResult Invoke()
{
var model = new string[]
{
"Hello", "from", "the", "view", "component."
};
return View("Default", model);
}
}
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>
<body>
<script src="js/jquery.min.js"></script>
<script>
$.get("home/GetHelloWorld", function(data) {
$("body").html(data);
});
</script>
</body>
@model string[]
@foreach(模型中的var项目)
{
- @项目
}
~/wwwroot/index.html
@model string[]
<ul>
@foreach(var item in Model)
{
<li>@item</li>
}
</ul>
<body>
<script src="js/jquery.min.js"></script>
<script>
$.get("home/GetHelloWorld", function(data) {
$("body").html(data);
});
</script>
</body>
$.get(“home/GetHelloWorld”,函数(数据){
$(“body”).html(数据);
});
localhost:5000/index.html
@model string[]
<ul>
@foreach(var item in Model)
{
<li>@item</li>
}
</ul>
<body>
<script src="js/jquery.min.js"></script>
<script>
$.get("home/GetHelloWorld", function(data) {
$("body").html(data);
});
</script>
</body>
当你说“它在等待”时,你是什么意思?也就是说,“it”是什么意思?页面仅在呈现组件时呈现。我希望页面完成呈现,然后组件应该异步呈现。另外,我希望有一个微调器(gif),它在组件未渲染之前一直处于适当位置。嗨,Shaun,我知道async在C#中的作用。在上面的代码中,组件的渲染将被阻止是正常的。但我希望页面的其余部分先呈现,然后是组件。我想我可以通过@await component.InvokeAsync()实现这一点。请在这里纠正我是的。你不能那样做。@await
仍然是服务器端而不是客户端。把它想象成C#code中的wait
。这只是意味着我们可以在服务器上开始一项任务和等待它完成之间做其他事情。它根本不与客户端通信。好的,误解了ViewComponent.InvokeAsync。那么,我可以使用AJAX调用组件吗?任何样品都会很有帮助。我试图实现的是:我有一个视图组件,我想在我的XYZ页面中使用它,但我希望该视图组件异步呈现。是的。看起来确实可以使用AJAX使用视图组件。谢谢,这很有帮助。