回调未发生onPress

Question

从我看来，一切似乎都还可以，但是回调并没有触发onPress，需要另一双眼睛的帮助来确定问题出在哪里。

class RandomNumber extends Component {

    static propTypes = {
        number: PropTypes.number.isRequired
    };

    handlePress = () => {
        console.log(this.props.number);
    };

    render() {
        return (
            <TouchableOpacity onPress={this.handlePress}>
                <Text style={styles.random}>{this.props.number}</Text>
            </TouchableOpacity>
        );
    }

}

Answer 1

您的handlePress语法是错误的，因为您试图替换用 onPress 事件触发的原始​​事件处理程序。

这是正确的语法（如果您想像完成操作一样将其引用到render方法中）：

    handlePress = () => event => {
        console.log(this.props.number);
    };

这就像您要用这个新事件处理程序包装原始事件处理程序。

这是一个非常强大的模式，因为有了它，您就可以避免将匿名箭头功能引入 render（）

您可以在此处详细了解这种可爱的图案：https://medium.com/silesis/handle-events-in-react-with-arrow-functions-ede88184bbb