asp.net-core - 如何强制 Blazor 重新渲染组件
问题描述
我正在使用 Blazor(客户端)构建一个简单的 Web 应用程序,并且需要让 Blazor 重新呈现组件。有没有办法通知框架重新渲染?
在此 Razor 页面上,我有一个简单的复选框,用于显示 Web 应用程序是否被用户授予了特定权限。
ShouldRender()
总是返回True
。当isGranted
field 设置为True
时,复选框不会呈现并且保持未选中状态。
剃须刀页面:
@page "/foo"
@inject IJSRuntime js
<input type="checkbox" disabled @bind="isGranted" /> Some Permission
@code {
bool isGranted;
protected override async Task OnInitAsync() {
await js.InvokeAsync<object>(
"foo.bar",
DotNetObjectRef.Create(this),
nameof(BarCallback)
);
}
[JSInvokable]
public void BarCallback(bool result) {
Console.WriteLine($"BarCallback(result: {result})");
isGranted = result;
}
protected override bool ShouldRender() {
Console.WriteLine("Blazor is checking for re-rendering...");
return true;
}
}
JavaScript 函数:
window.foo = {
bar: (dotnetObjRef, callback) => {
navigator.storage.persist()
.then(result => {
dotnetObjRef.invokeMethodAsync(callback, result)
.catch(reason => console.warn('Failed to call .NET method.', reason));
})
.catch(reason => console.warn('Failed to get permission.', reason));
}
}
Chrome 控制台中的输出:
WASM: Blazor is checking for re-rendering...
WASM: BarCallback(result: True)
.NET 核心 SDK:3.0.100-preview6-012264
Blazor 模板:Microsoft.AspNetCore.Blazor.Templates::3.0.0-preview6.19307.2
解决方案
StateHasChanged
通常,您通过调用该方法来强制重新渲染。
要使此应用程序正常工作,您应该将StateHasChanged();
其放在 BarCallback 方法的末尾。
希望这可以帮助。
推荐阅读
- matplotlib - 在 xz 平面上画圆
- android - 在 Android 11+ 模拟器中进行测试时,从计算机访问您自己的应用程序的沙盒文件夹
- android - ToolBar MenuItem 中 BadgeDrawable 的 LiveData 更新
- data-structures - 有效地创建结构化的二元决策图
- python - xmltodict 返回字符串而不是 OrderedDict
- c++ - 用整数填充数组的问题[Arduino]
- javascript - javascript全局变量的好习惯
- javascript - 在 axios 拦截器返回错误 res 后未定义
- django - background-tasks 创建任务和处理已完成的任务
- spring-boot - 将 WebClient 与 Spring MVC 一起使用时要使用的正确依赖项