2017-12-09 17 views
0

フォームを保持する反応コンポーネントを内部に作成しています。私はonChange()とhandleSubmit()関数を作成しようとしましたが、選択されたボタンの値を収集し、コンソールの値をログに記録しますが、イベントオブジェクトは認識されません。ラジオボタンでフォームの送信時にイベントオブジェクトが認識されない

Uncaught TypeError: Cannot read property 'target' of undefined

なぜこれが起こっているのですか。今、私はこれについて何ができるのですか?

class NoteInput extends React.Component { 
    constructor(props) { 
     super(props); 

     this.state={ 
      selectedValue: '' 
     } 

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

    handleChange(e) { 
     this.setState({selectedValue: e.target.value}) 
    } 

    handleSubmit(e) { 
     e.preventDefault(); 
     console.log(this.state.selectedValue); 
    } 

    render() { 
     return (
      <div> 
       <form onChange={this.handleChange()} > 
        <input type="radio" id="0" name="location" value={this.props.locations[0]} /> 
        <label htmlFor="choice1">Safa Park</label> 

        <input type="radio" id="1" name="location" value={this.props.locations[1]} /> 
        <label htmlFor="choice2">Mercato</label> 

        <input type="radio" id="2" name="location" value={this.props.locations[2]} /> 
        <label htmlFor="choice3">Burj Khalifa</label> 
       </form> 
       <input onSubmit={this.handleSubmit()} type="submit" value="Submit" /> 
      </div> 
     ); 
    } 
} 

答えて

0

あなたは、イベントハンドラに渡すのではなく、関数を呼び出している:

は、ここに私のコードです。代わりに関数を渡してください。

onChange={this.handleChange} 
onSubmit={this.handleSubmit} 
関連する問題