如何使用jquery刷新视图组件而不刷新页面

Question

我的视图中有一个视图组件

 @await Component.InvokeAsync("UserProfileCard")

我希望当我单击按钮时，仅刷新此组件，而无需使用 jquery ajax 或 jquery Unobtrusive 刷新页面

Answer 1

在组件周围创建 div

<div id="userProfileCard">
 @await Component.InvokeAsync("UserProfileCard")
</div>

创造行动

public class MyController : Controller {
    public IActionResult GetUserProfileCardComponent() {
        return ViewComponent("UserProfileCard", <arguments...>);
    }
}

阿贾克斯

<script>
    $.get("/MyController/GetUserProfileCardComponent", function(data) {
        $("#userProfileCard").html(data);
    });
</script>