在react native中，如何在几秒钟后从闪屏切换到登录屏幕？

import React, { useState, useEffect } from 'react';
import SplashScreen from './SplashScreen';
import LoginScreen from './LoginScreen';

const App = () => {
  const [showSplash, setShowSplash] = useState(true);

  useEffect(() => {
    // 使用定时器延迟几秒后切换到登录屏幕
    const timer = setTimeout(() => {
      setShowSplash(false);
    }, 3000);

    // 清除定时器
    return () => clearTimeout(timer);
  }, []);

  return showSplash ? <SplashScreen /> : <LoginScreen />;
};

export default App;

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

const SplashScreen = () => {
  return (
    <View style={styles.container}>
      <Text style={styles.logo}>Your Company Logo</Text>
      <Text style={styles.slogan}>Welcome to Your App</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#fff',
  },
  logo: {
    fontSize: 24,
    fontWeight: 'bold',
    marginBottom: 10,
  },
  slogan: {
    fontSize: 18,
    color: '#888',
  },
});

export default SplashScreen;

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

const LoginScreen = () => {
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Login Screen</Text>
      {/* Add login form and other components */}
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#fff',
  },
  title: {
    fontSize: 24,
    fontWeight: 'bold',
    marginBottom: 10,
  },
});

export default LoginScreen;