Reactjs 如何使用Redux提供程序包装导航堆栈（createSwitchNavigator）？

从我的Settings.js页面连接到redux应用商店时出现问题。我得到的错误是：

不变冲突：不变冲突：在“连接（设置）”的上下文中找不到“存储”。请在中包装根组件，或在“连接选项”中将自定义的React上下文提供程序传递给和相应的React上下文使用者以连接（设置）

我的SignIn.js页面与Settings.js页面的连接方式相同，但是Settings one似乎不起作用，而SignIn.js页面起作用。我的根组件被包装在提供者标记中，所以我有点迷路了。所有页面都应该可以访问redux存储。这可能是因为我在身份验证页面和应用程序页面之间使用createSwitchNavigator，或者因为我导出/导入的内容不正确，但我不太确定

有什么想法吗

相关职位：

---

App.js

export default class App extends React.Component {
    render() {
        const authStack = createStackNavigator({
            Onboarding: { screen: Onboarding },
            SignUp: { screen: SignUp },
            SignIn: { screen: SignIn },
        });

        const appStack = createBottomTabNavigator({
           Home: { screen: Home },
           Profile: { screen: Profile },
           Settings: { screen: Settings }
        });


        const Navigation = createAppContainer(createSwitchNavigator(
            {
                AuthLoading: AuthLoad,
                App: appStack,
                Auth: authStack,
            },
            {
                initialRouteName: 'AuthLoading',
            }
        ));

        return (
            <Provider store={store}>
                <Navigation/>
            </Provider>
        );
    }
}

导出默认类App扩展React.Component{
render（）{
const authStack=createStackNavigator({
入职：{屏幕：入职}，
注册：{屏幕：注册}，
签名：{屏幕：签名}，
});
const appStack=createBottomTabNavigator({
主页：{screen:Home}，
配置文件：{screen:Profile}，
设置：{屏幕：设置}
});
常量导航=createAppContainer（createSwitchNavigator(
{
AuthLoading:AuthLoad，
应用程序：appStack，
Auth:authStack，
},
{
initialRouteName:“AuthLoading”，
}
));
返回(
);
}
}

Settings.js[不工作]

class Settings extends Component {
    render() {
        return (
            <View>
                <Text>Settings Page</Text>
            </View>
        )
    }
}

const mapStateToProps = state => ({
    phone: state.user.phone,
});

export default connect(mapStateToProps)(Settings);

类设置扩展组件{
render（）{
返回(
设置页面
)
}
}
常量mapStateToProps=状态=>({
电话：state.user.phone，
});
导出默认连接（MapStateTops）（设置）；

SignIn.js[工作]

class SignIn extends Component {
    render () {
       return (
           <View>
               <Text>SignIn Page</Text>
           </View>
       )
    }
}

const mapStateToProps = state => ({
    phone: state.user.phone,
});


export default connect(mapStateToProps)(SignIn);

类签名扩展组件{
渲染（）{
返回(
登录页
)
}
}
常量mapStateToProps=状态=>({
电话：state.user.phone，
});
导出默认连接（MapStateTops）（登录）；

这是WebStorm自动导入功能的问题。它意外导入：

import connect from "react-redux/es/connect/connect";

而不是：

import { connect } from 'react-redux';

上述实现是正确的