我试图在不同的地方获取同一对象的位置,其中,使用 javascript 函数,我应该得到不同的顶部位置,但这不是场景。脚本代码:
<script type="text/javascript">
window.ShowAlert = function myFunction(element) {
console.log("Hello World.");
alert(element.offsetTop);
}
</script>
Index.razor代码:
@inject IJSRuntime jsRuntime
<div>
@for (int i = 0; i < 10; i++)
{
<div @onclick="MemberFunction" @ref="memberRef">Click Here</div>
}
</div>
@code {
private ElementReference memberRef;
void MemberFunction()
{
jsRuntime.InvokeAsync<object>("ShowAlert", memberRef);
}
}
正如你在这里看到的,我正在做一个for
在同一个 div 中,他向下线。我想从中得到的是每一个div
发布它应该给我一个不同的值offsetTop
,因为他一条一条地走下去。我该如何解决这个问题?
为了更好地理解这里你有一个演示https://blazorfiddle.com/s/4g57o82k。正如您在演示中看到的每个值点击这里是一样的。
感谢您的关注。
Edit:
我相信这是一个错误,所以我创建了一个issue。如果这不是问题或得到解决,我会在这里更新。
看着有关 lambda 表达式的文档
不要使用循环变量 (i
) in a for
直接在 lambda 表达式中循环。否则,所有 lambda 表达式都使用相同的变量,导致i
所有 lambda 中的值都相同。始终在局部变量中捕获其值(buttonNumber
在前面的示例中),然后使用它。
所以看看这个问题和给出的答案我稍微调整了一下并设法让它工作。
您需要在内部定义一个新变量for
保持价值i
.
@inject IJSRuntime jsRuntime
<div>
@for(var i = 0; i < memberRef.Count(); i++)
{
var i2 = i;
<div @onclick="() => MemberFunction(i2)" @ref="memberRef[i2]">Click Here</div>
}
</div>
@code {
private ElementReference[] memberRef { get; set; } = new ElementReference[11];
void MemberFunction(int i)
{
jsRuntime.InvokeAsync<object>("ShowAlert", memberRef[i]);
}
}
这是一个工作fiddle.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)