Несколько функций socket.emit () в Reactjs ES5 - PullRequest
Новая
       12

Несколько функций socket.emit () в Reactjs ES5

0 голосов
/ 03 сентября 2018

Я совершенно новичок в Reactjs и SocketIO. Я пытаюсь добавить функцию входа в систему и регистрации на простом веб-сайте, используя Reactjs, SocketIO и MySQL. Мне удалось настроить функционал входа в систему, используя следующий код 

let LoginForm = React.createClass({
componentDidMount() {
    socket.on('loginError', this.loginError);
},
loginError: function () {
    this.setState({error: <div className="alert alert-danger">Wrong email or  password</div>});
},
emitLogin: function () {
    socket.emit('login', {
        email: this.refs.email.value,
        password: this.refs.password.value
    });
},
getInitialState(){
    return {error: ''}
},
render: function () {
    return <div className="container" id="form-signin">
        <form>
            <h2>Sign In</h2>
            {this.state.error}
            <div className="form-group">
                <label htmlFor="email" className="sr-only">Email address</label>
                <div className="input-group">
                    <div className="input-group-addon"><i className="glyphicon glyphicon-envelope"/></div>
                    <input type="email" className="form-control" id="email" ref="email"
                           defaultValue={this.props.defaultEmail} placeholder="Email"/>
                </div>
            </div>
            <div className="form-group">
                <label htmlFor="password" className="sr-only">Password</label>
                <div className="input-group">
                    <div className="input-group-addon"><i className="glyphicon glyphicon-lock"/></div>
                    <input type="password" className="form-control" id="password" ref="password"
                           placeholder="Password"/>
                </div>
            </div>
            <button type="button" className="btn btn-lg btn-success btn-block" onClick={this.emitLogin}>Sign In
            </button>
            <div className="form-group">
                <p></p>
                <p className="center-para">Not a member? <a>Sign Up</a></p>
            </div>
        </form>
    </div>
}
});

Я хочу, чтобы ссылка Sign Up отображала форму регистрации. Когда я попытался добавить еще один socket.emit(), это не сработало (см. Код ниже). 

emitSignUp: function () {
    socket.emit('signup');
}

<a href="javascript:" onClick={this.emitSignUp}>Sign Up</a>

Я был бы очень признателен за помощь. Заранее спасибо.

...