使用React Native中的Socket.io发送和接收数据

Question

在sendDataToServer和receiveDataFrom服务器中，我想编写代码来使用Socket.io从ip地址发送和获取消息，但不知道如何做到这一点。请帮我。我会感激你的。 库必须安装（使用npm）并导入以使用Socket.io。

    React,
    { Component }
    from 'react';

import { 
    View, 
    Switch, 
    Text,
    TouchableOpacity } 
    from 'react-native';

import { connect } from 'react-redux';
import { onRelayClicked } from '../../actions';

import Card from '../common/Card';

class Relay extends Component {


    state = {
    switchValue: false
  };

    componentWillMount() {
        this.updateSwitch(this.getRelayValueAsTrueOrFlase());
    }

    getRelay() {
        return this.props.relay;
    }

    getPositionOfRelayClicked() {
        return this.props.buttonList.indexOf(this.getRelay());
    }

    getSwitchValue() {
        return this.state.switchValue;
    }


    getRelayValueAsTrueOrFlase() {
        if (this.getRelay().relay.value === 0) {
            return false;
        } 
        return true;
    }

    updateSwitch(value) {
        this.setState({ switchValue: value });
        this.updateButtonList();
    }

    relayClicked() {
        if (this.state.switchValue === true) {
            this.updateSwitch(false);
        } else {
            this.updateSwitch(true);
        }
    }

    // update the button list and update the list in database
    updateButtonList() {
        // udating the values locally
        this.props.buttonList[this.getPositionOfRelayClicked()].relay.value = 1;

        //calling the action creator
        this.props.onRelayClicked(this.props.buttonList);
        this.sendDataToServer();
    }

    sendDataToServer() {

    }

    receiveDataFromServer() {

    }


// put more methods here...
    render() {
        return (
        <TouchableOpacity onPress={this.relayClicked.bind(this)}>   
        <Card>
        <View style={styles.parentContainer}>

        <View style={styles.nameContainer}>
        <Text> {this.getRelay().name} </Text>
        </View>

        <View style={styles.switchContainer}>
        <Switch
          onValueChange={(value) => this.updateSwitch(value)}
          disable={false}   
          value={this.state.switchValue} />
        </View>

        </View>
        </Card>
        </TouchableOpacity>
            );
    }
}

const styles = {

    parentContainer: {
        flexDirection: 'row', 
        flex: 1,
        alignItems: 'center',
        height: 50,
        justifyContent: 'center'
    },

    switchContainer: {
        justifyContent: 'center',
        flex: 3
    },

    nameContainer: {
        flex: 7,
        justifyContent: 'center'
    },

};

const mapStateToProps = ({ buttonReducer }) => {
    console.log('mapi]ing state to props in relay');
    const { buttonList } = buttonReducer;
    return {
        buttonList,
    };
};

export default connect(mapStateToProps, { onRelayClicked })(Relay);