2016-12-08 9 views
1
alert('Save ${this.state.course.title}'); 

上記のことはうまくいくようですが、間違っていると思いますか?

私は

import React, {PropTypes} from 'react'; 

class CoursePage extends React.Component{ 

    constructor(props, context){ 
    super(props,context); 

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

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

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

    onClickSave(){ 
    alert('Save ${this.state.course.title}'); 
    } 

    render(){ 
    return (
     <div> 
     <h1>Courses</h1> 
     <h2>Add Course</h2> 
     <input 
      type="text" 
      onTitleChange={this.onTitleChange} 
      value={this.state.course.title} /> 

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

export default CoursePage; 

をクリックすると、また、これは私がテストを入力することはできません保存するときにだけ、ダイアログのテキストボックスに入力したテキストを表示する必要があり、完全なコードをリストした、これはもちろん:{title: ""}?

私は

答えて

1

テンプレートの文字列は引用符をバック使用/ Reduxのを反応学ぶしようとしています:私は

onChange={this.onTitleChange} 

当たり前に

onTitleChange={this.onTitleChange} 

を変更

alert(`Save ${this.state.course.title}`); 
関連する問題