Reactjs-onClick 事件在我第一次单击按钮时未触发答案

【问题标题】：Reactjs-onClick event not firing the first time i click buttonReactjs-onClick 事件在我第一次单击按钮时未触发
【发布时间】：2019-02-21 15:58:07
【问题描述】：

我有一个问题，当我第一次单击时，我的按钮没有触发，但第二次单击时正常工作，有什么帮助吗？我不明白为什么会这样

    render() {
    return (
    <button type="button" className="basic-submit-button"  onClick={this.submitUsernameChange}>{window.main.resources["SaveChangesButton"]}</button>
    );
}

submitUsernameChange() {
    if (this.canSubmit()) {
        PersonalInfoActions.changeUsername(this.state.newUsername);
        HeaderActions.logout();
        this.setState({ submitting: false });
    }
}
    constructor(props) {
    super(props);

    this.submitUsernameChange = this.submitUsernameChange.bind(this);
    this.state = PersonalInfoStore.getState();
}

【问题讨论】：

this.canSubmit()，你能不能把这个方法展示一下
canSubmit() { return this.refs.newUsername.isValid();我试图调试它，但第一次点击它没有输入 submitUserNameChange 方法
你能在这里创建一个可重现的代码框吗codesandbox.io/s/new
我想我不能，这是一个非常大的复杂项目，有很多文件:(

标签： reactjs

【解决方案1】：

如果有人遇到此类错误，我修复了将 handlerBur 更改为 onKeyPressUp 事件的问题。似乎是重叠的事件。

【讨论】：

【解决方案2】：

在允许表单提交之前，您应该检查 newUsername 是否有效。您可以禁用提交按钮并检查用户名在类型上是否有效。

【讨论】：

是的，完整的 js 文件已经验证过了，真正的问题是它在第一次点击时没有进入 submitUserNameChange 方法，已经尝试调试它。