Реагировать на все экраны с помощью встроенной переменной Navigation pass.

Question

Я использую «WatermelonDb» с «React-Navigation 5», чтобы иметь глобальный доступ к переменной базы данных со всех экранов моего приложения.

Из того, что я понимаю, передать начальные переменные на экран в Для навигации мы используем «initialParams».

Однако, когда я это делаю, я получаю сообщение об ошибке:

TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Database'
    |     property 'collections' -> object with constructor 'CollectionMap'
    |     property 'map' -> object with constructor 'Object'
    |     property 'alarms' -> object with constructor 'Collection'
    --- property 'database' closes the circle

Есть ли альтернатива для получения доступа к переменной базы данных глобально?

Вот часть моего кода, где я пытаюсь передать переменную базы данных в intialParams

render()
  {
return ( 

  <NavigationContainer>
       <Stack.Navigator 
              initialRouteName="HomeScreen">
        <Stack.Screen
          name="HomeScreen"
          component={HomeScreen}      
         initialParams={{db:database} } // <-
          options={{title: 'Welcome',headerShown: false}}
        />
        <Stack.Screen name="AlarmDetails" options={{title: 'Welcome',headerShown: false}} component={AlarmDetails} />
      </Stack.Navigator>
    </NavigationContainer>

  )

Answer 1

Вы должны взглянуть на Контекст https://reactjs.org/docs/context.html

Answer 2

Похоже, что передача не сериализуемых объектов в initialParams - это не путь к go.

Возможно реализовать его по-другому. Вы можете просто создать некоторый файл, например database.js, который экспортирует объект базы данных, а затем импортирует его на ваши экраны. Чтобы избежать повторения, вы также можете, например, создать HO C, например withDatabase, а затем обернуть свои экраны в этот компонент.

withDatabase(AlarmDetails)

Вы также можете использовать React Context для той же цели.