Я создаю мобильное приложение, используя базы данных React Native и Firebase Realtime. Когда пользователь входит в мое приложение, пользовательский пользователь создается и сохраняется в базе данных реального времени. В то же время он создается, пользователь перенаправляется на домашний экран, где я показываю некоторые пользовательские данные пользователя. Проблема в том, что домашний экран отображается перед созданием пользовательского пользователя, и это создает ошибку.
Я слышал, что проблема может быть решена с использованием прослушивателя базы данных, но я еще не полностью понял эту концепцию. Как я могу заставить приложение ждать создания настраиваемого пользователя?
const HomeScreen = (props) => {
const dispatch = useDispatch();
const loadUser = useCallback(async () => {
try {
await dispatch(userActions.fetchUser());
} catch (err) {
console.log(err.message);
}
}, [dispatch]);
useEffect(() => {
loadUser();
}, [dispatch, loadUser]);
const currentUser = useSelector((state) => state.user.currentUser);
return (
<View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}>
<Text>{customUser.nickname}</Text>
</View>
);
};
Вызов fetchUser()
извлекает пользователя из firebase. Поскольку пользователь еще не создан, эта функция возвращает неопределенное значение.
export const fetchUser = () => {
return async (dispatch, getState) => {
const token = getState().auth.token;
const userId = getState().auth.userId;
try {
const response = await fetch(
`https://test-app.firebaseio.com/users/${userId}.json?auth=${token}`
);
if (!response.ok) {
throw new Error("Something went wrong!");
}
const resData = await response.json();
// Stores the user in redux state
dispatch({
type: FETCH_USER,
user: resData,
});
} catch (err) {
throw err;
}
};
};
Что можно сделать, чтобы решить эту проблему?