- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
在过去的几天里,我试图在我的 Blazor 应用程序中读取浏览器分辨率。我正在尝试这样做:[JSInvokable] Blazor Methode 由 JS 脚本调用。
1.我的问题是:宽度和高度仅在我重新加载(手动刷新)页面后显示在我的 blazorpage 中。我不能调用 this.StateHasChanged() 因为我的方法是静态的。
如何调用 StateHasChanged 或我需要做什么才能显示新数据?我是 ASP.net 等方面的新手,所以请尽可能包含一个代码示例;)
这是我的 Code blazor(服务器端)代码:
@page "/"
@inject IJSRuntime jsRuntime
<h1>Window Dimensions</h1>
<p>Window Width: @Width</p>
<p>Window Height: @Height</p>
<p>@DebugString</p>
@code {
public static int Width;
public static int Height;
public static string DebugString;
[JSInvokable]
public static async Task GetBrowserDimensions(int width, int height)
{
Width = width;
Height = height;
if (Width < 600)
{
DebugString = "small_UI";
}
if (Width >= 600)
{
DebugString = "big_UI";
}
}
}
这是我的 .js 代码:
//------JS Code for the resize stuff incl. timer so that resize doesnt fire every pixel move
var resizeId;
window.addEventListener('resize', function () {
clearTimeout(resizeId);
resizeId = setTimeout(doneResizing, 500);
});
function doneResizing() {
var width= window.innerWidth;
var height= window.innerHeight;
alert('Width: ' +width + ' Height: ' +height);
DotNet.invokeMethodAsync('Blazor_PageResolutionJS', 'GetBrowserDimensions', width, height);
}
//^^^^^^JS Code for the resize stuff incl. timer so that resize doesnt fire every pixel move
2。为了做出用户界面设计选择,获取浏览器的分辨率是否可行?
感谢阅读
最佳答案
您可以通过安装 NuGet 包来绕过此需求 https://www.nuget.org/packages/BlazorPro.BlazorSize/
如果您仍然对自己编写代码感兴趣,可以在 https://github.com/EdCharbeneau/BlazorSize/tree/master/BlazorSize 找到 BlazorSize 的源代码。
从 JavaScript 调用 StateHasChanged 的解决方案涉及在 .NET 中使用 [JsInvokable] 方法。但是,如果您查看 BlazorSize 的源代码,您会发现需要做很多额外的工作才能从 DOM 中正确删除事件监听器。
关于c# - Blazor:如何在 JSInterOP 调用后调用 StateHasChanged(尝试在通过 JS 调整大小事件调整大小后将 BwoserResolution 获取到 Blazor App)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64093028/
我知道调用StateHasChanged()方法通知组件状态已更改,因此它应该重新渲染。 但是,我也看到了对 await InvokeAsync(StateHasChanged) 的调用。或 awai
这个问题在这里已经有了答案: Display wait or spinner on API call (7 个答案) 关闭 2 年前。 我使用 bool 属性在用户单击按钮后禁用它,这样单击就不会发
我正在学习 Blazor 组件,我想知道 StateHasChanged 会强制组件重新呈现所有自身还是仅重新呈现差异。智能感知报告指出 Notifies the component that its
看来StateHasChanged()仅在对任务执行等待操作后触发组件的重新渲染(找到 here)。 所以我只想使用 StateHasChanged用于重新渲染而不是使用 Task.delay或 Ta
我正在制作一个 Blazor 服务器端项目,我想制作一个点击后停用的按钮,但不使用 disabled 的属性.代码非常简单: @functions { LogInForm logInForm
我已阅读文章“3 Ways to Communicate Between Components in Blazor”并尝试这样做。我在@body 下有消息组件,并且必须更改@body 组件消息中的用户
我正在使用多个组件是我的应用程序每个都以有条件的方式呈现。是否有可能单独重新渲染特定组件? MyRazor.razor 文件, Second @if (renderOne) {
从任意线程调用 StateHasChanged() 是否安全? 让我给你一些背景。想象一个服务器端 Blazor/Razor Components 应用程序,您有: 从任意线程引发 BreakingN
当用户按下特定按钮时,我需要在按钮内显示动画并禁用它(调用的方法需要几秒钟才能完成)。这是我的html: @if (IsDownloadi
我的页面(组件)上有一个按钮,单击时会调用 Refresh() 方法。此方法然后调用 StateHasChanged(),但不会重新加载页面。 GetData() 正在调用外部 API 以从数据库加载
我有一个使用 Blazor InputFile 组件作为子组件的组件。 当我选择一个文件时,按预期调用 OnChange 处理程序。但是,如果我两次选择同一个文件,则不会再次调用 OnChange 处
我很难理解什么时候应该打电话 StateHasChanged()当 Blazor 拦截到某些内容发生更改时,必须重新渲染。 我创建了一个示例项目,其中包含一个按钮和一个名为 AddItem 的自定义组
在过去的几天里,我试图在我的 Blazor 应用程序中读取浏览器分辨率。我正在尝试这样做:[JSInvokable] Blazor Methode 由 JS 脚本调用。 1.我的问题是:宽度和高度仅在
我是一名优秀的程序员,十分优秀!