在我的 Blazor 应用程序中,我在 View 中有以下输入字段:
<input bind="@amount.Display" type="text" />
这绑定(bind)到使用以下访问器定义的属性:
get
{
return _display;
}
set
{
var parsed = Decimal.Parse(value);
_display = parsed.ToString("F2");
}
真正的访问器逻辑比这更复杂,但我已经在上面尽可能地简化了它,同时仍然保留了让我感到困惑的行为。
基本上,当用户输入“2”,然后在输入字段之外进行制表符或点击时,我希望它自动转换为“2.00”。奇怪的是,这种转换似乎只有在用户输入的字符串表示的数字与已经存在的数字不同时才会发生。例如,如果输入字段当前的值为“1.00”并且我输入“2”,我正确地以“2.00”结束。但是,如果输入字段的值为“2.00”并且我输入“2”,则它仍然是“2”。就好像在后一种情况下没有调用 set 访问器,我无法想象为什么。
最佳答案
主要问题是,如果 Blazor 认为文本框的值没有改变,它就不会更新文本框。您的示例存在的部分问题是值(您的属性)的内部表示有时与您在文本框中看到的内容不一致( 2
与 2.00
)。但就 Blazor 而言,如果属性值没有改变,它不会将绑定(bind)传播回文本框。
我玩弄了您的代码的许多变体(使用 value
和 onchange
手动“绑定(bind)”),但最终如果当您的代码完成更新 value 属性并且值与以前相同时,什么也没有将会发生。
我能想到的唯一解决方法是通过使用异步引入一个非常丑陋的 hack。当你这样做时,事件循环在 await
之后完成。 (blazor 将接受 2
的新值),并且 blazor 将在恢复 await
时再次检查是否有任何更改调用,因为此时它是新一轮的事件循环。由于新值现在将是 2.00
而不是 2
它刷新文本框。
@functions {
private string value;
private string Value
{
get => value;
set => SetValue(value);
}
private async void SetValue(string value)
{
this.value = value;
await Task.Delay(1);
this.value = decimal.Parse(value).ToString("F2");
StateHasChanged();
}
}
希望比我更了解 Blazor 的人可以提供一些不那么残暴的东西。但它确实有效。 (顺便说一句,
Task.Delay(0)
不起作用,可能是由于一些优化,其中任务已经完成,因此没有获得退出事件循环的 promise 。)笔记:
一旦 Blazor 格式字符串(即
format-value="yyyy-MM-dd"
)接受数字,您可能可以通过将值存储为小数并直接在 razor 标记中使用格式字符串来简化此操作。
关于c# - 绑定(bind)属性在更改时不更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52902780/