Кнопка входа в мой компонент React Auth не будет работать на мобильном телефоне - PullRequest
0 голосов
/ 29 апреля 2020

У меня есть приложение React / Node с аутентификацией с использованием JWT. Он работает на рабочем столе, но когда я нажимаю на кнопку входа на мобильном телефоне (Android Pixel 2), ничего не происходит. Вот компонент Auth:

Я пробовал его на физическом мобильном телефоне, используя эмулятор. Не работает ни на одном. Он находится на сервере Node / Express, который работает на локальном хосте.

import React, {Component} from 'react';
import {connect} from 'react-redux';

import {authUser, logout} from '../store/actions';

class Auth extends Component {
constructor(props){
    super(props);
    this.state = {
        username: '',
        password: ''
    };

    this.handleChange = this.handleChange.bind(this);
    this.handleOnSubmit = this.handleOnSubmit.bind(this);
}

handleChange(e) {
    this.setState({[e.target.name]: e.target.value});
}

handleOnSubmit(e) {
    const {username, password} = this.state;
    const {authType} = this.props;
    e.preventDefault();

    this.props.authUser(authType || 'login', {username, password});
}


    render()
    {
        const {username, password} = this.state;

        return <div>
            <form className="form" onSubmit={this.handleOnSubmit}>
                <label className="form-label" htmlFor="username">username</label>
                <input className="form-input" 
                type="text" 
                value={username} 
                name="username" 
                autoComplete="off"
                onChange={this.handleChange} />

                <label className="form-label" htmlFor="password">password</label>
                <input  className="form-input"
                type="password" 
                value={password} 
                name="password"
                autoComplete="off"
                onChange={this.handleChange} />


                    <button className="button" type="submit">Submit</button>


            </form>
        </div>;
    }
}

export default connect
(
    () => ({}),
    {authUser, logout}
)(Auth);
...