Get state in React Native IOS Tab Bar

Question

I'm a bit new to react-native , so I might not have understood this while reading the docs but. I have a tab bar in an ios app with 2 tabs.

Currently the view code for one of the tabs is in the same file as the page that loads the the Tab bar (I call this HomeTab ). The second tab (call Tab2 ) which contains the view code for the second tab is in a separate .js page and is loaded into HomeTab .

I'm having trouble passing information in HomeTab's state to Tab2 , and do not want to write all of Tab2 into HomeTab like I did for Tab1 because I will get a really big file.

The code structure is a bit like this:

    {View Code for Tab 1 here}

    <TabBarIOS selectedTab={this.state.selectedTab}>
            <TabBarIOS.Item
                selected={this.state.selectedTab === 'Tab1'}
                title = "Tab1"
                icon = {require('image!Tab1')}
                onPress={() => {
                    this.setState({
                        selectedTab: 'Tab1'
                    }

                    );
                }}>

                // Call Tab1 View here

            </TabBarIOS.Item>

            <TabBarIOS.Item
                selected={this.state.selectedTab === 'Tab2'}
                title = "Tab2"
                icon = {require('image!Tab2')}
                onPress={() => {
                    this.setState({
                        selectedTab: 'Tab2'
                    }
                    );
                }}>

                <Tab2/>
            </TabBarIOS.Item>

Intuitively I feel like all I am doing is putting code in a separate file, so both tabs should have the same state, but when I print out anything from my state it is undefined. Any advice would be appreciated! Thanks.

Answer 1

I was fairly ignorant of the capabilities of javascript. I was able to pass props just by including it in the call to Tab2 like this

    <Tab2 propName = {some information}/>