Blazor WebAssembly .NET 6 JS互操作找不到函数问题求助

核心问题：JS对象未挂载到全局window对象 #

Blazor WebAssembly的IJSRuntime调用JS函数时，默认在window全局对象中查找对应的属性/方法。你当前的JS代码使用let声明bweInterop变量，在浏览器顶级作用域下，let声明的变量不会自动挂载到window对象上，导致Blazor无法找到该对象。

解决步骤 #

1. 修改JavaScript代码，显式挂载到window #

将wwwroot/js/bweInterop.js中的代码修改为：

window.bweInterop = {};
window.bweInterop.getWindowSize = function () {
    return {
        width: window.innerWidth,
        height: window.innerHeight
    };
}

或者使用var声明（var声明的顶级变量会自动挂载到window）：

var bweInterop = {};
bweInterop.getWindowSize = function () {
    return {
        width: window.innerWidth,
        height: window.innerHeight
    };
}

2. 可选：调整JS文件引用顺序（增强稳定性） #

将自定义JS文件的引用放在blazor.webassembly.js之前，确保Blazor应用启动前，你的JS代码已经加载完成：

<body>
    <div id="app">Loading...</div>

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>
    <script src="js/bweInterop.js"></script> 
    <script src="_framework/blazor.webassembly.js"></script>
</body>

额外验证点 #

确认C#的WindowSize类属性名称与JS返回的字段匹配（JS返回width/height，C#类需对应Width/Height，Blazor默认支持驼峰到帕斯卡命名的自动映射，这部分通常无需额外配置）。

内容的提问来源于stack exchange，提问作者Timber