无法以编程方式使用react-form设置文本

时间:2017-06-21 14:30:53

标签: javascript forms reactjs google-chrome-extension react-redux

我想模拟一个类似于page的反应表单页面中的设置文本(页面的来源不可用)。

我正在使用以下代码,这对我来说非反应形式,但它似乎没有在上面的情况下更新react模型 - 在设置文本因某些原因清除输入后手动点击表单

请注意,我将代码作为内容脚本从扩展程序运行,因此我无法更改应用程序的实现。 这是我的示例JS代码:

var e = document.body.querySelector("[placeholder='Your name']");
e.value = "my new value";
e.dispatchEvent(new Event('change', {bubbles: true, cancelable: false}));

一些澄清:

我向页面注入代码没有问题,但是我没有页面,我的解决方案需要很强大 - 尽可能多地填充页面。
我上面编写的代码在原始页面的上下文中运行,而不是扩展程序的沙箱,因此这里不需要考虑这个问题。
我正在寻找的是上述代码精神的代码片段,它不依赖于特定的反应形式实现,并使用本机事件将文本应用于输入字段。

1 个答案:

答案 0 :(得分:0)

似乎问题与反应16表单处理技术有关。他们在dom元素值上使用属性描述符(this库帮助我找到问题的根源。)
在这里张贴,如果有人会遇到类似的问题。