использование навигации по ящику с реагированием на прогресс компонента содержимого

#react-native #react-navigation

#react-native #реагирование-навигация

Вопрос:

Я пытался использовать панель навигации с реакцией в своем приложении. Я понял, что мы получаем прогресс (реанимированный узел) ящика в реквизитах drawerContent навигатора. Могу ли я каким-либо образом использовать этот прогресс в моем экранном компоненте. Вот мой код.

    const drawerContent = useCallback(
         ({ progress, ...props }: any) => {
             setProgress(progress);
             return (
                 <DrawerContent {...props} />
             )
         }, []
   )
    <Drawer.Navigator
      drawerContent={drawerContent}>
      <Drawer.Screen name="HomeDrawer">
        {(props) => <Screen {...{ style }} {...props} />}
      </Drawer.Screen>
    </Drawer.Navigator>
  

Ответ №1:

Чтение документов для react-navigation для последней версии 6.x отсюда:

https://reactnavigation.org/docs/drawer-navigator/#drawercontent

Вы должны использовать useDrawerProgress() hook для получения текущего прогресса в ящике. И обязательно вызывайте useDrawerProgress() внутри своего пользовательского DrawerContentView интерфейса в противном случае, если вы пытаетесь получить прогресс до:

 <Drawer.Navigator>
  <Drawer.Screen name="HomeDrawer" component={Home}/>
</Drawer.Navigator>
  

Это не сработает, поскольку оно не создано и не существует в иерархии представлений.