Estoy tratando de pasar algunos accesorios al componente Stack.screen pero no puedo encontrar una manera de acceder a ellos en el componente funcional
export default function App() { const [user, setUser] = useState(null); return ( <NavigationContainer> <Stack.Navigator> <Stack.Screen initialParams={{ user: { user }, setUser: { setUser } }} name="Login" component={LoginScreen} options={{ title: 'Login' }} /> <Stack.Screen user={user} name="Home" component={Dashboard} /> </Stack.Navigator> </NavigationContainer> ); }Aquí estoy tratando de configurar el token para el usuario con el gancho setUser, pero no sé cómo tomar ese accesorio.
function LoginScreen({ navigation, user, setUser }) { const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); const handleEmailChange = (email) => { setEmail(email); } const handlePasswordChange = (password) => { setPassword(password); } const handleSubmit = async () => { try { const response = await fetch('https://mytodoappbackend.herokuapp.com/login', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ email: email, password: password }) }) // navigation.navigate('Home', { name: 'Jane' }) const responseJson = await response.json(); if (responseJson.token) { setUser(responseJson.token); navigation.navigate('Home', { name: 'Jane' }) } else { Alert.alert('Hata', 'Kullanıcı adı veya şifre hatalı'); } console.log(responseJson); } catch (err) { console.log(err); } } return ( ... ); }Se puede acceder a la propiedad initialParams de StackNavigator , o por cualquier otro navegador en react-native-navigation , desde la propiedad de route que pasa el navegador a cualquier componente que sea una Screen .
Por lo tanto, no puede desestructurarlos directamente desde props . Debe acceder a ellos a través de la route de la siguiente manera.
function LoginScreen({ navigation, route }) { console.log(route.params) }O si tiene muchos parámetros de ruta, aún puede usar la desestructuración de la siguiente manera.
function LoginScreen({ navigation, route }) { const {user, setUser} = route.params }Editar: Por cierto, no debe pasar funciones como parámetros de ruta, pero este es un problema diferente...