从纯JS文件中恢复本机传递状态

时间:2017-08-14 10:06:49

标签: react-native redux

我在我的主索引文件或我的主要组件上有我的react组件我想将状态更改传递给该组件但是从纯JS文件/函数不确定什么是最好的方法或正确的方法这样做。我用redux测试了它,但感觉有点过分,特别是因为我需要通过加载进度。

它基本上是加载覆盖,需要从post api文件中调用。

这是我的代码 索引

render() {
        return (
            <View style={styles.container}>
                <Provider store={store}>
                    <ConnectedRouter>
                        <Scene key="root" hideNavBar hideTabBar>
                            <Scene key="public">
                                <Scene key="login" component={Login} initial={true} title={'Login'} />
                                <Scene key="ResetPassword" component={ResetPassword} title={'Reset Password'} />
                            </Scene>
                            <Scene key="tabBar" tabs lazy>
                                <Scene key="tab1" title="Home" tabBarLabel="Home" icon={HomeTabIcon}>
                                    <Scene key='Home' component={Home} title='Home' initial={true}  panHandlers={null}/>
                                    <Scene key='Teams' component={Teams} title='Teams' initial={false} />
                                </Scene>
                                <Scene key="tab2" title="Photos" tabBarLabel="Photos" icon={PhotosTabIcon}>
                                    <Scene key='Photos' component={Photos} title='Photos' back backTitle='Back' initial={false} />
                                    <Scene key='SinglePhoto' component={SinglePhoto} title='Photo' back backTitle='Back' initial={false} />
                                    <Scene key='PhotoUpload' component={PhotoUpload} title='Upload Photo' back backTitle='Back' initial={false} />
                                </Scene>
                                <Scene key="tab3" title="Site Diary" tabBarLabel="Site Diary" icon={SiteDiaryTabIcon}>
                                    <Scene key='SiteDiary' component={SiteDiary} title='SiteDiary' initial={false} />
                                </Scene>
                            </Scene>
                        </Scene>
                    </ConnectedRouter>
                </Provider>
                <MessageBar/>
                <LoadingOverlay isVisible={this.state.overlayIsVisible} progress={this.state.overlayProgress} indeterminate={this.state.indeterminate}  />
            </View>
        );
    }

API文件

export const sync = (isConnected) => {

    const offlineData = store.getState().newData;
    console.log(offlineData);

    // We have offline data
    if(!_.isEmpty(offlineData.photos)){
        console.log('We have offline data')

        // We have a connection
        if(isConnected) {
            console.log('We have a connection')

            // Loops thur the offline data and uploads it
            //for (let i = 0; i < offlineData.length; i++) {

            //}
        }

    }

};

通过以下

从索引调用
// Connection function for offline / online
    _handleConnectionChange = (isConnected) => {
        // Updates the store with selected project
        store.dispatch(connectionActionCreators.update(isConnected));

        // Gets the offline data from the store
        const hasOfflineData = store.getState().newData.hasData;
        console.log(hasOfflineData);

        if(hasOfflineData){
            this.setState({
                overlayIsVisible:true,
                //overlayProgress:0,
            });
        }

        // Syncs data
        syncOffineData.sync(isConnected);
    };

0 个答案:

没有答案