如何解决Blazor:可重用的 OnSelect 更改事件
是否有更可重用的版本:
void OnSelectFoundWithCus(ChangeEventArgs e)
{
selectedString = e.Value.ToString();
displayToggle("FoundWithCus");
}
async Task displayToggle(string DivToToggle)
{
if(selectedString == "Yes")
//if (!isChecked)
{
await JSRuntime.InvokeAsync<object>("showElement",new { id = DivToToggle });
isChecked = !isChecked;
}
else
{
await JSRuntime.InvokeAsync<object>("hideElement",new { id = DivToToggle });
isChecked = !isChecked;
}
}
我想要一个可重用的方法,我可以通过一个字符串来隐藏/显示什么 Div,但它似乎不是 ChangeEventArgs 方法的一个选项。用户希望根据选项选择(全部是/否)在隐藏和可见之间切换几个控件。理想情况下,我宁愿只有一种可以像这样使用的方法:
void OnSelect(ChangeEventArgs e,string DivToToggle)
{
selectedString = e.Value.ToString();
displayToggle(DivToToggle);
}
尝试使用更改类的方法,如下所示:
<div class="@className"></div>
然后
void OnSelect(ChangeEventArgs e)
{
selectedString = e.Value.ToString();
if (selectedString == "No")
{
className = "form-group row";
}
else
{
className = "Invisible";
}
}
当任何引用它的控件选择一个选项时,会显示/隐藏使用 class="@className" 的每个控件。
解决方法
看来我可能问错了问题。基本上,我需要将附加参数传递给带有 ChangeEventArgs 参数的函数。到目前为止,我发现的第一个功能版本是这个设置(直到我可以让非 JavaScript 版本工作):
对于选择控件:
<select @onchange='(e => DisplayToggle(e,"DMGReported"))' class="form-control">
<option value=" "> </option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
对于 C#:
async Task DisplayToggle(ChangeEventArgs e,string DivToToggle)
{
selectedString = e.Value.ToString();
if (selectedString == "Yes")
{
await JSRuntime.InvokeAsync<object>("showElement",new { id = DivToToggle });
selectedString = "";
}
else
{
await JSRuntime.InvokeAsync<object>("hideElement",new { id = DivToToggle });
selectedString = "";
}
}
对于 IJSRuntime:
function hideElement(styleOp) {
document.getElementById(styleOp.id).style.display = "none";
}
function showElement(styleOp) {
document.getElementById(styleOp.id).style = null;
document.getElementById(styleOp.id).style.visibility = "visible";
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。