Javascript 从客户端浏览器控制台手动响应组件事件激发

在我的网站中，我使用React Js创建了一个div元素，并且它也是可编辑的。如果用户编辑内容，它将触发onInput函数

r.createElement("div", {
                dangerouslySetInnerHTML: {
                    __html: e
                },
                dir: "auto",
                ref: "input",
                spellCheck: this.props.spellCheck,
                "data-tab": this.props.editable ? 1 : null ,
                contentEditable: this.props.editable,
                className: t,
                onInput: this.onInput,
                onPaste: this.onPaste,
                onCut: this.onCut,
                onKeyUp: this.onKeyUp,
                onKeyPress: this.onKeyPress,
                onMouseDown: this.onMouseDown,
                onContextMenu: this.onContextMenu,
                onFocus: this.props.onFocus,
                onBlur: this.props.onBlur
            }

我正在尝试从客户端chrome浏览器控制台将内容设置为该元素，并且它不会触发onInput事件。

---

我的问题是，有一种方法可以动态添加输入，并调用为元素附加的输入事件。

您可以从控制台调度事件

1.通过querySelector..查找dom节点，或者在“元素”选项卡中选择元素，使用$0

const input = document.querySelector('[contentEditable]');

2.创建事件

const eventX = new Event('input', {bubbles: true});

3.改变价值

input.textContent = "TEST";

4.调度事件

input.dispatchEvent(eventX)

---

谢谢！你是天才！！非常感谢你！我认为这是不可能的