ReactJS onClickトリガー自体は発動しません

Question

リアクション新人はここ！

私は、教育プロジェクトのごく一部として、ここではかなり単純な構成要素を持っている

：

import React, {PropTypes} from 'react'; 


class CoursesPage extends React.Component { 
    constructor(props, context) { 
    super(props, context); 

    this.state = { 
     course: {title: ""} 
    }; 

    this.onTitleChange = this.onTitleChange.bind(this); 
    this.onClickSave = this.onTitleChange.bind(this); 
    } 

    onTitleChange(event) { 
    const course = this.state.course; 
    course.title = event.target.value; 
    this.setState({course: course}); 
    } 

    onClickSave() { 
    alert(`Saving ${this.state.course.title}`); 
    } 


    render() { 
    return (
     <div> 
     <h1>Courses</h1> 
     <h2>Add Course</h2> 

     <input 
      type="text" 
      onChange={this.onTitleChange} 
      value={this.state.course.title} /> 

     <button type="submit" onClick={this.onClickSave}>Save</button> 
     </div> 
    ); 
    } 

} 

export default CoursesPage; 

私の問題は、今私は、保存ボタンをクリックすると、警告ダイアログが自分自身をポップしないということですアップ。 は、今まで私はこれについて2つの理論を持っている：

• onClickトリガーが警告ダイアログが自分自身を提示していない何らかの理由で
• を動作しません。

注：コンポーネントクラスコンストラクタにthisをバインドするのを忘れていません。

アイデア？あなたは間違って結合されているあなたのコンストラクタで

Answer 1

、タイプミスがあります：

this.onClickSave = this.onTitleChange.bind(this);

は次のようになります。

this.onClickSave = this.onClickSave.bind(this);

Answer 2

あなたはこのように、矢印の機能を使用することができます。

を

onClickSave =() => { 
    alert(`Saving ${this.state.course.title}`); 
} 

このウェあなたはコンストラクタでこれをバインドする必要はありません