Используйте оператор переключения с Firebase в React Drawer Navigatoin - PullRequest
Новая
       65

Используйте оператор переключения с Firebase в React Drawer Navigatoin

0 голосов
/ 30 мая 2020

У меня есть навигация по ящику, в которой я хотел бы отображать только определенные экраны на основе условия из базы данных реального времени firebase, но функция ниже возвращает undefined. Это в expo React Native. 

function getType(){

  Firebase.database().ref('allTeachers/' + Firebase.auth().currentUser.uid + '/name')
  .once('value').then(function(snapshot){

    return snapshot.exists()
  })
}

, и это навигатор, в котором я хочу использовать результат этой функции. Навигатор находится внутри функционального компонента 

!user ? (
            <Drawer.Screen name = "Log In" component={SignUp}/>
            ):getType() ?(

              <>
              <Drawer.Screen name = "Session Creation" component={TeacherSession} />
              <Drawer.Screen name = "Activate Session" component={StartSession} />
              <Drawer.Screen name = "Teacher Details" component={TeacherDetails} />
              <Drawer.Screen name = "Sign Out" component={SignOut} />

              </>
            ):(

                <>
                <Drawer.Screen name = "Student Details" component={StudentDetails} />

                <Drawer.Screen name = "Sign Out" component={SignOut} />
                </>
            )}

Я хочу иметь возможность переключаться между двумя случаями в зависимости от того, существует ли путь или нет, может ли кто-нибудь мне с этим помочь?

Спасибо

1 Ответ

0 голосов
/ 30 мая 2020

Функция getType () не имеет оператора возврата, поэтому она никогда не вернет значение. Чтобы добиться того, чего вы хотите, вам придется управлять этим асинхронно. Простой способ выполнения sh с использованием состояния.

Предполагая, что компонент, который содержит ваш навигатор, является функциональным, должно работать следующее: 

const [exists, setExists] = useState(false);

function getType(){

  Firebase.database().ref('allTeachers/' + Firebase.auth().currentUser.uid + '/name')
  .once('value').then(function(snapshot){

    setExists(snapshot.exists());
  })
}

React.useEffect(() => {
    getType();
}, []);

... 

!user ? (
            <Drawer.Screen name = "Log In" component={SignUp}/>
            ):exists ?(

              <>
              <Drawer.Screen name = "Session Creation" component={TeacherSession} />
              <Drawer.Screen name = "Activate Session" component={StartSession} />
              <Drawer.Screen name = "Teacher Details" component={TeacherDetails} />
              <Drawer.Screen name = "Sign Out" component={SignOut} />

              </>
            ):(

                <>
                <Drawer.Screen name = "Student Details" component={StudentDetails} />

                <Drawer.Screen name = "Sign Out" component={SignOut} />
                </>
            )}
...