NavigationContainer Problem in Custom NavBar

[alpertas]

I have some problems that I can't get over.

This is my TabBar Component: NavBar.js: ` ... // Js import { AnimatedTabBarNavigator } from "react-native-animated-nav-tab-bar"; //Pages import Home from "../../pages/Home"; //Home Page

const Tabs = AnimatedTabBarNavigator(); // thanks. https://js.coach/package/react-native-animated-nav-tab-bar export default () => { return ( <Tabs.Navigator // default configuration from React Navigation tabBarOptions={{ activeTintColor: "#2F7C6E", inactiveTintColor: "#222222", activeBackgroundColor: "#e4e4e7", }}

</Tabs.Navigator> ); }; `

And this is my App.js: ` //NavBar import NavBar from "./src/components/NavigationBar/NavBar"; import { NavigationContainer } from "@react-navigation/native";

export default function App() { return (

); } ... error and explanation: Component Exception Couldn't register the navigator. Have you wrapped your app with 'NavigationContainer'? `

full error: ` Error: Couldn't register the navigator. Have you wrapped your app with 'NavigationContainer'?

This error is located at: in BottomTabNavigator (at NavBar.js:25) in _default (at App.js:16) in EnsureSingleNavigator (at BaseNavigationContainer.tsx:409) in ForwardRef(BaseNavigationContainer) (at NavigationContainer.tsx:91) in ThemeProvider (at NavigationContainer.tsx:90) in ForwardRef(NavigationContainer) (at App.js:15) in RCTView (at View.js:34) in View (at App.js:11) in App (created by ExpoRoot) in ExpoRoot (at renderApplication.js:45) in RCTView (at View.js:34) in View (at AppContainer.js:106) in DevAppContainer (at AppContainer.js:121) in RCTView (at View.js:34) in View (at AppContainer.js:132) in AppContainer (at renderApplication.js:39) at node_modules\react-native\Libraries\LogBox\LogBox.js:148:8 in registerError at node_modules\react-native\Libraries\LogBox\LogBox.js:59:8 in errorImpl at node_modules\react-native\Libraries\LogBox\LogBox.js:33:4 in console.error at node_modules\expo\build\environment\react-native-logs.fx.js:27:4 in error at node_modules\react-native\Libraries\Core\ExceptionsManager.js:104:6 in reportException at node_modules\react-native\Libraries\Core\ExceptionsManager.js:171:19 in handleException at node_modules\react-native\Libraries\Core\setUpErrorHandling.js:24:6 in handleError at node_modules\expo-error-recovery\build\ErrorRecovery.fx.js:12:21 in ErrorUtils.setGlobalHandler$argument_0 at node_modules\regenerator-runtime\runtime.js:63:36 in tryCatch at node_modules\regenerator-runtime\runtime.js:294:29 in invoke at node_modules\regenerator-runtime\runtime.js:63:36 in tryCatch at node_modules\regenerator-runtime\runtime.js:155:27 in invoke at node_modules\regenerator-runtime\runtime.js:165:18 in PromiseImpl.resolve.then$argument_0 at node_modules\react-native\node_modules\promise\setimmediate\core.js:37:13 in tryCallOne at node_modules\react-native\node_modules\promise\setimmediate\core.js:123:24 in setImmediate$argument_0 at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:130:14 in _callTimer at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:181:14 in _callImmediatesPass at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:441:30 in callImmediates at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:387:6 in __callImmediates at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:135:6 in guard$argument_0 at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:364:10 in guard at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:134:4 in flushedQueue at [native code]:null in flushedQueue at [native code]:null in invokeCallbackAndReturnFlushedQueue `

[neelpatel23]

Wrap Tabs.Navigation in NavigationContainer

[torgeadelin]

Duplicate of #81