从 JS 更新时未检测到 Blazor 双向绑定

Question

我有一个简单的双向绑定组件：

<input type="text"  id="myInput" bind="@MyVar" />
...
@functions {
    private string MyVar { get; set; } = "foo";

当我在输入框上写文本时，一切正常。但是，如果输入值是从 javascript 设置的，则 blazor 无法检测到更改后的值。

document.getElementById('myInput').value='Random Value';

我试图在元素上引发一些事件，例如“按键按下”等，但私有变量 MyVar 在 blazor 客户端没有变化。

我想从客户端向 blazor 发送一些值，我想更改隐藏输入的值可能是解决方案，但不起作用。

Answer 1

由于 Blazor 将自身附加到 onchange 事件，因此您可以通过在设置元素后触发元素上的“onchange”事件来完成此操作。

var element = document.getElementById('myInput');
element.value = 'Random Value';
element.dispatchEvent(new Event('change'));  //<--makes Blazor see the change

在许多情况下，当您可以使用现有的 javascript 库时，无需重新发明一切。