Add documentation for single file nested navigation structures about rfcs

[devika7]

Hi @Laurensdc, thanks so much for the above code. I am wondering if it would hold same for react-navigation 3.x.x. I used something similar like yours, and getting this error.

error: "The navigation props is missing for this navigator. in react navigation 3, you need to set up your app container directly. "

I know I need to use CreateAppContainer function somewhere to solve this. Could you please guide me? This is my TestNav file

#TestNav.js

import Portfolio from "./Portfolio";
import SignupScreen from "./SignupScreen";
import ResetPassScreen from "./ResetPassScreen";
import WelcomeScreen from "./WelcomeScreen";
import Logout from "./Logout";
import Investments from "./Investments";
import Profile from "./Profile";
import LoginScreen from "./LoginScreen";
import {createStackNavigator, createBottomTabNavigator } from 'react-navigation';

export const TestNav = createStackNavigator(
    {
        Login: {
            screen: WelcomeScreen,
            screen: LoginScreen,
        },
        Signup: {
            screen: SignupScreen,
            screen: Logout,
        },
        Reset: {
            screen:ResetPassScreen
        },

        mainTabNavigator: {
            screen: createBottomTabNavigator(
                {
                    HomeStack: {
                        screen: createStackNavigator(
                            {
                                Overview: {
                                    screen: Portfolio,
                                },
                               
                            },
                            {
                                headerMode: 'none',
                            }
                        )
                    },
                    LinkStack: {
                       
                        screen: createStackNavigator(
                            {
                               Investments: {
                                    screen: Investments,
                                },
                                
                            },
                            {
                                headerMode: 'none',
                            }
                        )
                    },

                    SettingStack: {
                        screen: Profile,
                    },
                },
                {
                    //tabBarPosition: 'bottom',
                    navigationOptions: ({ navigation }) => ({
                        // ...                         
                    }),
                    tabBarOptions: {
                       // ...
                    },
                }
            )
        }
    },
    {
        headerMode: 'none',
        // onTransitionStart: (e) => {
        //     console.log('Navigating somewhere');
        //     console.log(e);
        // },
    }
);

export default TestNav;