onClickでハンドル関数を呼び出すと

Question

https://codepen.io/gaearon/pen/VmmPgp?editors=1010と同じことをしようとしています。だから私はフォームを持って、私はリダイレクトするパラメータ（最初の入力内のパラメータ）としたい。

私のコードは次のとおりです。

var React = require('react'); 
var ReactDOMServer = require('react-dom/server'); 

class Views_Delete_Delete extends React.Component { 
    constructor(props) { 
     super(props); 
     this.state = {value: ''}; 

     this.handleChange = this.handleChange.bind(this); 
     this.handleSubmit = this.handleSubmit.bind(this); 
    } 

    handleChange(event) { 
     event.preventDefault(); 
     this.setState({value: event.target.value}); 
    } 

    handleSubmit(event) { 
     event.preventDefault(); 
     alert('Valeur : '); 

    } 

    render() { 
     var data = this.props.data; 

     return (
      <div className="delete"> 
       <label> 
        Supprimer les données dun bon de travail : 
        <input className="input_id_traitement" type="text" value={data.id_traitement} onChange={this.handleChange}/> 
       </label> 
       <input className="btn_delete_traitement" type="submit" value="Delete" onClick="{this.handleSubmit}" /> 
      </div> 
     ); 
    } 
} 

module.exports = Views_Delete_Delete; 

私はすべてのエラーを持っていないが、私は私のボタンをクリックすると、ページがリロードされます。私も<Link>を使用するために反応ルータで試しましたが、どちらもうまくいきません。

Answer 1

"submit"ボタンタイプでは、フォームを送信しようとします。デフォルトの振る舞いは、ブラウザをフォームactionに移動することです。より良い

<input className="btn_delete_traitement" type="button" value="Delete" onClick="console.log('test');" /> 

イベント：ボタンをonClickを使用していない

最も簡単な解決策は、「ボタン」に「提出」からボタンの種類を変更することです。代わりに、フォームonSubmitのイベントを処理します（ボタンタイプ "submit"）。