İçinde ok işlevlerini kullanma React.createClass

Question

Küçük projem için mümkün olduğunca ES6 (ES2015) kullanmak istiyorum. Şimdi React ile ok işlevlerini kullanmak istiyorum. Ben bu çalışma almak için ne yapmam gerekiyor ne

// What I want 
let Text = React.createClass({ 
    componentDidMount:() => { 
     setInterval(this.updateCurrentTime, 1000); 
    } 
} 

// What I have 
let Paragraph = React.createClass({ 
    render:() => (<div className="MySuperTable"><Text name="Dodo" startDate={(new Date()).toString()} /></div>) 
}); 

let Text = React.createClass({ 
    getInitialState: function() { 
     return { 
      currentTime: (new Date()).toString() 
     } 
    }, 
    componentDidMount: function() { 
     setInterval(this.updateCurrentTime, 1000); 
    }, 
    updateCurrentTime: function() { 
     this.setState({ 
      currentTime: (new Date()).toString() 
     }); 
    }, 
    render: function() { 
     return (
      <div> 
       <span>Hello my name is {this.props.name}</span> 
       <span>And I was born on {this.props.startDate}</span> 
       <span>And I now it's {this.state.currentTime}</span> 
      </div> 
     ); 
    } 
}); 

ReactDOM.render(
    <Paragraph/>, 
    document.getElementById('container') 
); 

1. ?
2. this 'un anlaşıldığı gibi, createClass içine aktarılan nesne olacaktır, bu doğru mu?
3. Text örneğine nasıl bağlarım?

Şimdiden teşekkürler. Dediğiniz gibi

Answer 1

Sen ES6 mümkün olduğunca kullanmak istediğini, bu

class Text extends React.Component { 
    constructor() { 
    super(); 
    this.state = { currentTime: (new Date()).toString() }; 
    } 

    componentDidMount() { 
    setInterval(() => this.updateCurrentTime(), 1000); 
    } 

    updateCurrentTime() { 
    this.setState({ 
     currentTime: (new Date()).toString() 
    }); 
    } 

    render() { 
    return <div> 
     <span>Hello my name is { this.props.name }</span> 
     <span>And i was born { this.props.startDate }</span> 
     <span>And i now it's { this.state.currentTime }</span> 
    </div> 
    } 
}; 

let Paragraph =() => { 
    return <div className="MySuperTable"> 
    <Text name="Dodo" startDate={ (new Date()).toString() } /> 
    </div> 
}; 

Example

React - Reusable Components

Answer 2

gibi ES2015 kodunuzu değiştirebilirsiniz. Yani createClass kullanmak yerine, 'React.Component' kullanabilirsiniz, daha fazla bilgi here bulabilirsiniz.

Ve sonra, ok işaretini kullanmak için Babel, preset-2015'i kullanabilirsiniz.