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

Question

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

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

现在它起作用了。这是预期的行为吗，我 100% 安全吗？

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

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 并检查其中的状态，您可以执行以下操作var ev2 = new Event('input', { bubbles: true});input.dispatchEvent(ev2);其中输入将是对您想要触发事件的元素的引用，这里有更多关于 refs 的信息：https ://reactjs.org/docs/refs-and-the-dom.html