#javascript #reactjs #react-native
#javascript #reactjs #react-native
Вопрос:
Я новичок в react native и javascript. пытался использовать потоки аутентификации на странице инициализации, чтобы узнать, зарегистрирован ли пользователь, а затем перенаправить их на соответствующую страницу. Сообщение отображается, когда пользователь регистрируется, и он переходит на другую страницу.
сообщение об ошибке,
Вот код, используемый на странице аутентификации.
import React from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import { FontAwesome5 } from '@expo/vector-icons';
import { useNavigation } from '@react-navigation/native';
import styles from './styles';
import { isSignedIn, getUserType } from '../../services/auth';
export default function(){
const navigation = useNavigation()
async function goToLoginOng(){
navigation.navigate('Login', {
userType: 'ong',
route: 'sessions'
})
}
async function goToLoginUser(){
navigation.navigate('Login', {
userType: 'user',
route: 'userlogin'
})
}
async function userisLogged() {
if (isSignedIn){
const userType = getUserType();
if (userType === 'user'){
navigation.navigate('Incidents')
}
else {
navigation.navigate('Profile')
}
}
}
userisLogged();
return(
<View style={styles.container}>
<Text style={styles.bigQuestion} >Quem é você?</Text>
<TouchableOpacity style={styles.box} onPress={goToLoginUser}>
<FontAwesome5 name='user' size={60} color='#FFF' style={styles.iconStyle} />
<Text style={styles.title}>Pessoa</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.box} onPress={goToLoginOng}>
<FontAwesome5 name='users' size={60} color='#FFF' style={styles.iconStyle} />
<Text style={styles.title}>ONG</Text>
</TouchableOpacity>
</View>
)
}
и вот функции аутентификации, которые я использовал.
import React from 'react';
import { AsyncStorage } from 'react-native';
export const isSignedIn = async() => {
const response = await AsyncStorage.getItem('userToken')
if (response !== null){
return true
}
else {
return false
}
}
export const getUserType = async () => {
const response = await AsyncStorage.getItem('userType')
return response;
}
Сказал это, если вы можете предложить способы улучшить это или другой лучший способ сделать это, я был бы заранее благодарен.
Ответ №1:
Я думаю, проблема в том, что userisLogged()
она запускается непосредственно внутри функционального компонента.
Это означает userisLogged()
, что срабатывает всякий раз, когда отображается эта страница аутентификации.
Таким образом, эта функция запускается один раз при первоначальном отображении страницы.
Это может быть реализовано с помощью useEffect
hook .
useEffect(() => {
userisLogged()
}, [])
Приведенный выше код равен componentDidMount()
in class component .