插座.io只在一个react本地组件上工作?

我有一个包含一些组件的react-native项目。现在,我有一个带有以下代码的导航助手:

const AppNavigator = createStackNavigator({
Login: {screen: Login},
SinglePage: {screen: SinglePageChat},
Home: {
    screen: createBottomTabNavigator({
        Home: {screen: ChatHome},
        ChatPage: {screen: ChatPage},
        Settings: {screen: Settings},
    }, {
        tabBarOptions: {
            style: {
                backgroundColor: "#eff0f1",
                borderTopWidth: 1,
                borderTopColor: "#D3D3D3"
            },
            indicatorStyle: {
                backgroundColor: "red"
            }
        },
        lazy: false,
        navigationOptions: {
            header: null
        }
    })
}

},  {
    initialRouteName: 'Login',
    headerMode: 'float', // screen for Android
});
// below options foreach page and the export default

如你所见,我的主页是登录。现在,用户进入登录,这里我检查他是否有令牌,如果有,我将他重定向到主屏幕。在这里,我将用户连接到插座.io而且很管用。

我还有一个叫做“单页聊天”的页面,用户可以在那里聊天。现在我有个问题。以下面的代码为例:

// in constructor
this.socket = SocketIOClient('http://217.***.***.***:3000'); // this is the connection to the socket
// the code below is in the componentDidMount()
this.socket.on('hasMessages', (data) => {
      console.log(data);
});

这行不通。但在聊天室或聊天页面中,插座工作得很好。现在,我需要SinglePageChat组件中的代码。

为什么在那个页面上不起作用?关于navigator的事?我不明白为什么会这样,我希望我足够清楚地解释我的问题!如果你需要更多的代码示例,让我知道!