无法给<input/>元素派发change事件？

Question

export default function App() {
    return (
        <div>

            <input
                onChange={
                    () => {console.log("我变了")}
                }
            />

            <button
                onClick={
                    e => {
                        let i = e.currentTarget.previousSibling
                        i.dispatchEvent(new Event('change'))
                    }
                }
            >
                点我
            </button>

        </div>
    )
}

点击<button/>，<input/>的change事件为何不被触发？

Answer 1

我用你给的代码试了一下，不管是用React，还是用原生JS来写，都确实不能触发的。

看了一下MDN网站的解读：浏览器原生的事件，只能被动触发。只有自定义的事件，才可能通过dispatchEvent方法主动触发。

MDN参考：https://developer.mozilla.org...