是否可以使用 setState 触发 onChange 事件？

Question

是否仅在用户输入输入字段时触发 onChange 事件？

我想在表单上设置一个脏标志，因此当用户导航出页面时，它会触发一个对话框，询问他是否真的要放弃更改。 isDirty 标志在我的组件的 state 中，它在用户输入输入字段时设置。 我担心当我在构造函数中使用预定义的输入值初始化 state 时，它可能会意外触发 onChange 导致 state 更改并导致当用户甚至没有输入字段时将 isDirty 设置为 true。

现在它有效。 这是预期的行为吗？我 100% 安全吗？

代码示例：是否有可能通过在构造函数中初始化 state 或在按钮 onClick 处理程序中设置 state 来触发 handleChange？

class ExampleComponent extends React.Component {
    constructor(props) {
      super(props);
      this.state = { exampleInput: "exampleValue" };
    }

    handleChange = (event) => {
      this.setState({
         exampleInput: event.target.value,
      });
    }

    onExampleButtonClick = () => {
      this.setState({
         exampleInput: "buttonClicked",
      })
    }

    render() {
      return (
        <div>
          <input name="exampleInput" value={this.state.exampleInput} onChange={this.handleChange}/>
          <button onClick={this.onExampleButtonClick}>Example Button</button>
        </div>
      );
    }
}

Answer 1

是的，如果条件有效，您可以使用 componentDidUpdate 并检查 state 里面的内容，您可以这样做

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

其中输入将是您想要在此处触发事件的元素的引用： https://reactjs.org/docs/refs-and-the-dom.html