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

【问题标题】：how to refresh view component without refreshing page with using jquery如何使用jquery刷新视图组件而不刷新页面
【发布时间】：2021-12-04 19:10:53
【问题描述】：

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

 @await Component.InvokeAsync("UserProfileCard")

我希望当我点击一个按钮时，只有这个组件会被刷新，而不使用 jquery ajax 或 jquery Unobtrusive 刷新页面

【问题讨论】：

你点击的是什么按钮？

标签： c# jquery asp.net asp.net-core .net-core

【解决方案1】：

围绕组件创建 div

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

创建动作

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

ajax

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

【讨论】：

【解决方案2】：

我知道使用 jQuery 的方式是重新绘制页面呈现的 div/span 的 .html() 并使用组件的新内容刷新它

eq：让我们假设 userProfileCard 是一个 div，那么代码将是这样的：

$("#userProfileCard").html(newData)

【讨论】：