Question

我想通过使用js代码段填充表单来自动化React应用，但是我无法使其调用onChange处理程序。我使用以下代码发出更改事件：

const event = new Event("change", 
{ 
    bubbles: true, 
    cancelable: true, 
    view: window,
    target: { value: "new value"}
});
const element = document.querySelector("#inp");
element.value = "new value";
const cancelled = element.dispatchEvent(event);

但是React拒绝更改文本输入的值。

完整的示例在这里https://jsfiddle.net/gLysoa8v/3/

Answer 1

谷歌搜索了一下之后，我找到了这个问题的解决方案：What is the best way to trigger onchange event in react js

var nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value").set;
nativeInputValueSetter.call(input, 'react 16 value');

var ev2 = new Event('input', { bubbles: true});
input.dispatchEvent(ev2);

在React控制的输入中模仿用户输入

1 个答案: