onSubmit() 在 React.js 中不起作用答案

【问题标题】：onSubmit() is not working in React.jsonSubmit() 在 React.js 中不起作用
【发布时间】：2018-07-25 14:18:25
【问题描述】：

我有一个form，如下所示

<form className="ui form" onSubmit={this.update}>
     <input type="text" defaultValue={this.props.element} onChange={this.handleChange1}/>
     <input type="button" value="Update" className="ui positive icon button"/>
 </form>

我的更新功能如下

update = event => {
   console.log('hello');
   event.preventDefault();  
}

但它不起作用。

【问题讨论】：

标签： reactjs forms

【解决方案1】：

提交按钮的类型不应为button，而应为submit。

示例

class App extends React.Component {
  update = event => {
    console.log("hello");
    event.preventDefault();
  };

  render() {
    return (
      <form className="ui form" onSubmit={this.update}>
        <input
          type="text"
          defaultValue={this.props.element}
          onChange={this.handleChange1}
        />
        <input
          type="submit"
          value="Update"
          className="ui positive icon button"
        />
      </form>
    );
  }
}

ReactDOM.render(<App />, document.getElementById("root"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id="root"></div>

【讨论】：

【解决方案2】：

你的按钮应该是type='submit'

【讨论】：