如何将我自己的事件侦听器添加到我的自定义 React Native 组件中？

所以我使用 React Native+Expo 并且我制作了一个自定义组件，它是一个步进器。看起来像这样：

这是它的代码：

import React, { useState } from 'react';
import { View, Text,StyleSheet, TouchableOpacity } from 'react-native';



const Stepper = (props) => {
    let counter = 0;

    const increment = () => {
        counter += 1

    }
    
    const decrement = () => {
        counter -= 1
    }

    return (

        <View style={{ ...styles.stepperStyle, ...props.containerStyle }}>
            <TouchableOpacity style={{
                backgroundColor: props.leftColor,
                flex: 1,
                alignItems: 'center',
                justifyContent: 'center',
                borderTopLeftRadius: props.radius,
                borderBottomLeftRadius: props.radius
            }}>
                <Text adjustsFontSizeToFit={true} style={{ fontSize: 40 }}>-</Text>
            </TouchableOpacity>
            <View style={{
                borderLeftWidth: 1,
                borderRightWidth: 1,
                alignItems: 'center',
                justifyContent: 'center',
                flex: 1
            }}>
                <Text style={props.labelStyle}>{props.initialValue} {props.label}</Text>
            </View>
            <TouchableOpacity style={{
                backgroundColor: props.rightColor,
                flex: 1,
                alignItems: 'center',
                justifyContent: 'center',
                borderTopRightRadius: props.radius,
                borderBottomRightRadius: props.radius
            }}>
                <Text adjustsFontSizeToFit={true}
                    style={{ fontSize: 40 }}>+</Text>
            </TouchableOpacity>
        </View>

    );

}

const styles = StyleSheet.create({
    stepperStyle: {
        backgroundColor: 'transparent',
        flexDirection: 'row',
        borderRadius: 100,
        borderWidth: 1,
        width: '100%',
        height: 42
    }

});
export default Stepper

我想要做的是制作某种事件侦听器或函数，可以在计数器值发生变化时返回它。

所以从外面看，我希望它看起来像这样：

<Stepper
   onValueChange={count => setSets(count)}
/>

我刚开始做这样的事情。我需要使用 useEffect 钩子吗？获取当前计数器值的最佳方法是什么？任何帮助，将不胜感激！