2016-11-24 2 views
0

Eine Klasse erhalten und ein Ereignis an das übergeordnete Element zurückgeben. Ich möchte die Nummer der berührten Tasten erhalten (Beschriftung auf der erhöhten Taste). Ich gebe das Ereignis zurück, aber ich kann nicht finden, was ich will, wenn ich console.log() es. Es enthält einen Handler (Objekt), Target (SyntheticUIEvent) und IsRevoked (Bool).Wert von onTouchTap-Ereignis erhalten

interface INumberButtonRow { 
row: number; 
handleButtonClicked: any; 
} 

export class NumberButtonRow extends React.Component<INumberButtonRow, any> { 
render() { 
    // Create button with a number label 
    return (<NumberButton buttonClicked={this.handleButtonClicked} number={1} />); 
} 

// Get number from onTouchTap or from number 
handleButtonClicked(onTouchTapEvent) { 
    console.log(onTouchTapEvent) 
    } 
} 

interface INumberButtonProps { 
number: number; 
buttonClicked: any; 
} 

export class NumberButton extends React.Component<INumberButtonProps, any> { 
render() { 
    let number = this.props.number.toString(10) 
    return <RaisedButton label={number} onTouchTap={this.props.buttonClicked}/>; 
    } 
} 

Antwort

1

Die onTouchTapEvent.target sollte das Button-Element sein, und Sie sollten das Etikett von dem bekommen können, (Sie werden es zu any werfen müssen).

Aber ich denke, das ist besser:

export class NumberButtonRow extends React.Component<INumberButtonRow, any> { 
    ... 

    handleButtonClicked(label: string) { 
     console.log(label) 
    } 
} 

export class NumberButton extends React.Component<INumberButtonProps, any> { 
    render() { 
     return <RaisedButton label={number} onTouchTap={() => { 
      this.props.buttonClicked(this.props.number.toString(10)); 
     }}/>; 
    } 
}