Question

在本机应用中，我有2页。如果我在2页上传带有数据的redux商店，那么返回1页 - 如何使用2页上传的数据访问商店？那么有没有办法使用来自本地的所有页面的数据访问商店？也许simoke示例或在哪里阅读？感谢

   1page.js 
    class ScreenHome extends Component{

        static navigationOptions = {
            title: 'ScreenHome',
        };
        constructor(props){
            super(props)
            console.log("PROPS: ",props);
        }
        render() {
            const { navigate } = this.props.navigation;
            return (
                <View>
                    <Button
                        title="Go to load data page"
                        onPress={() => navigate('New', { name: 'Jane' })}
                    />
                    <Button
                        title="Get redux data"
                        onPress={() => {console.log(this.props)}}
                    />
                </View>
            );
        }
    }

    class ScreenRegister extends Component{
        static navigationOptions = {
            title: 'ScreenRegister',
        };
        render(){
            return <Text>ScreenRegister</Text>
        }
    }
    const MainScreenNavigator = DrawerNavigator({
        Recent: {
            screen: ScreenHome
        },
        All: {
            screen: ScreenRegister
        },
    });
    export default SimpleApp = StackNavigator({
        Home: {
            screen: MainScreenNavigator
        },
        Chat: {
            screen: ScreenHome
        },
        New: {
            screen: testScreen
        }
    });
    const mapStateToProps = (state) => {
    const {items, isFetching, done} = state.myTestData
    return {testScreen:{items, isFetching, done}};
}

const mapDispatchToProps = (dispatch) => {
    return {
        getNewItems: () => {
            dispatch(fetchData());
        }
    }
}

export default someTest = connect(
    mapStateToProps,
    mapDispatchToProps
)(SimpleApp)



    2page.js
        class testScreen extends Component{
            static navigationOptions = {
                title: 'testScreen.js',
            };


            _reduxStuff = () => {
                this.props.getNewItems();
            }
            render() {
                const { navigate } = this.props.navigation;
                const {done, items, isFetching} = this.props.testScreen;
                return (
                    <View>
                        <Text>Some new screen</Text>
                        <Button
                            title="Load Data"
                            onPress={() => this._reduxStuff()}
                        />
                    </View>
                );
            }
        }

        const mapStateToProps = (state) => {
            const {items, isFetching, done} = state.myTestData
            return {testScreen:{items, isFetching, done}};
        }

        const mapDispatchToProps = (dispatch) => {
            return {
                    getNewItems: () => {
                        dispatch(fetchData());
                    }
            }
        }

        export default FilterLink = connect(
            mapStateToProps,
            mapDispatchToProps
        )(testScreen)

Answer 1

每个页面都应该有一个容器，要在页面之间访问的数据存储以及更改此存储的操作。通过使用mapStateToProps，您可以将此商店传递到页面的容器。你可以在here中找到很好的例子。

Answer 2

在您的第一个容器上，您需要进行异步调用才能填满您的商店。

您可以在componentWillMount()上进行调度，并使用收到的数据填充商店。

如何通过redux存储在页面之间进行原生反应？

2 个答案: