Question

得到一个课程并将一个事件返回给父母。我想获得触摸的按钮编号（凸起按钮上的标签）。我确实返回了这个事件，但是当我在console.log（）它时，我找不到我想要的东西。它包含一个Handler（对象），Target（SyntheticUIEvent）和IsRevoked（bool）。

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}/>;
    }
}

Answer 1

onTouchTapEvent.target应该是按钮元素，您应该可以从中获取标签（您需要将其转换为any）。

但我认为这更好：

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));
        }}/>;
    }
}

从onTouchTap事件中获取价值

1 个答案: