Reactjs 反应，物料界面：提交按钮在手机上不起作用

我的react组件

登录

控制用户登录功能。我有一个MaterialUI提交按钮，用于发布用户凭据。它工作正常，除了在手机上——当用户在手机上时，submit按钮不工作，onClick事件也不会触发。有没有关于如何让它工作的建议

以下是登录组件：

import React from 'react'
import Header from './Header'
import TextField from "@material-ui/core/TextField";
import Button from '@material-ui/core/Button'
import {Link} from 'react-router-dom'
import firebase from 'firebase'
import {auth} from 'firebase/app'


class Login extends React.Component {
  constructor() {
    super();
    this.state = {
      email: "",
      password: "",
      errors:[]
    };
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }



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

  handleSubmit(e) {
    e.preventDefault()
    const { email, password } = this.state
    const { history } = this.props
    const errorLog = []
  
    auth().signInWithEmailAndPassword(email, password)
      .then((res) => {
        history.push('/gigregister')
        console.log(`token: ${res.data.user.getIdToken()}`)
      })
      .catch((err) => {
        if(err.code === 'auth/wrong-password'){
         errorLog.push('Wrong credentials, please try again')
         this.setState({
          errors: errorLog
        })
        }
      })
    
  }

  render() {
  
    return (
      <>
        <div>
          <Header />
        </div>
        <div className = 'login-container'>
        <div className ='gig-button'>
        <Link to="/Homepage" style={{ textDecoration: "none" }}>
         <button className = 'gig-button-button'>Gigs this week</button>
        </Link>
        </div>
        <div className="login-main">
          <div className="login">
            <h4>Venue login</h4>
            <h5>Not registered? Sign up <Link to="/venueregister" style={{ textDecoration: "none" }}>here</Link></h5>
            <form onSubmit={this.handleSubmit}>
            <TextField
                placeholder="Enter email"
                id="email"
                name="email"
                onChange={this.handleChange}
              />
              <TextField
                placeholder="Enter password"
                id="password"
                name="password"
                error ={this.state.errors ? true : false}
                errorText = {this.state.errors}
                helperText = {this.state.errors}
                onChange={this.handleChange}
                type ='password'
              />
              <div className="button">
                <Button type="submit">Submit</Button>
              </div>
            </form>
          </div>
        </div>
        </div>
      </>
    );
  }
}

export default Login;

从“React”导入React
从“./头”导入头
从“@material ui/core/TextField”导入TextField；
从“@material ui/core/Button”导入按钮
从“react router dom”导入{Link}
从“firebase”导入firebase
从“firebase/app”导入{auth}
类登录扩展了React.Component{
构造函数（）{
超级（）；
此.state={
电邮：“，
密码：“”，
错误：[]
};
this.handleChange=this.handleChange.bind（this）；
this.handleSubmit=this.handleSubmit.bind（this）；
}
手变（e）{
这是我的国家({
[e.target.name]：e.target.value，
});
}
handleSubmit（e）{
e、 预防默认值（）
const{email，password}=this.state
const{history}=this.props
常量错误日志=[]
auth（）.使用电子邮件和密码登录（电子邮件，密码）
。然后（（res）=>{
history.push（“/gigregister”）
console.log（`token:${res.data.user.getIdToken（）}`）
})
.catch（（错误）=>{
如果（err.code==='auth/密码错误'）{
errorLog.push（'凭据错误，请重试'）
这是我的国家({
错误：错误日志
})
}
})
}
render（）{
返回(
本周的演出
场馆登录
没有注册？在这里注册
提交
);
}
}
导出默认登录；

您需要将

光标：“指针”

添加到按钮的CSS规则中。这允许移动设备识别按钮按下并触发点击事件

您将在中找到更多信息

希望这个答案有帮助