React native 如何在React hook中使用计时器？

我正在用react native开发一个应用程序，我正在尝试为它的启动屏幕设置一个动画。我想在3秒后导航到下一个屏幕。我想知道如何将计时器（如setTimeOut（））与诸如useffect（）的react挂钩一起使用。这是我的代码：

const SplashScreen = props => {
    const opacityVal = new Animated.Value(0);
    const fadeAnime = () => {
        Animated.timing(opacityVal, {
            toValue: 1,
            duration: 2000,
            useNativeDriver: true,
        }).start()
    }
    let timer = setTimeout(() => props.navigation.navigate({ routeName: 'UserAuthenication'}), 2000);

    useEffect(fadeAnime, [opacityVal]);
    useEffect(()=>{
        return(() => clearTimeout(timer))
    }, []);
    return(
        <View style={styles.MainContainer}>
           <Animated.View style={{opacity: opacityVal}}>
              <TouchableOpacity style={styles.AnimeContainer}>
                 <Image source={require('../Pics/SplashScreenPic.jpg')} style={styles.ImageContainer}/>
              </TouchableOpacity>
           </Animated.View>
        </View>

    );
};

---

在

useffect

调用中移动计时器：

useffect（（）=>{
const timer=setTimeout（（）=>props.navigation.navigate（{routeName:'userauthenation'}），2000）；
返回(
（）=>清除超时（计时器）
)
}，[道具导航]；

你能详细说明一下发生了什么事吗？你说它不工作是什么意思？动画完成后，应用程序应该导航到下一个屏幕。但它没有发生。

let timer = setTimeout(() => props.navigation.navigate({ routeName: 'UserAuthenication'}), 2000);
 useEffect(()=>{
        return(() => clearTimeout(timer))
    }, []);