auth/invalid-email 电子邮件地址格式错误答案

【问题标题】：auth/invalid-email The email address is badly formattedauth/invalid-email 电子邮件地址格式错误
【发布时间】：2021-03-25 18:03:12
【问题描述】：

我正在创建项目并使用 firebase 进行身份验证，所以当我运行程序并登录时出现错误。我的代码没有错误，但是当我检查我的检查时，出现了这样的问题。所以我该怎么做？

我已经检查了我的代码，但我不知道发生了什么。

import React, {Component} from 'react';
import './Login.css';
import fireApp, { database } from '../firebase/firebase'
class Login extends Component {
    state = {
        email:'',
        password:''
    }







    handleChangeText = (e) =>{
        //console.log(e.target.id)
        this.setState({
            [e.target.id]: e.target.value,
        })
    } 

    handleLoginSubmit = () =>{
        const {email,password} = this.state;
        const {history} =  this.props;
        console.log('data before send:',email,password)
        fireApp.app.auth().signInWithEmailAndPassword(email,password)
        .then(res => {
            console.log('success: ', res);
            history.push('/dashboard')
        })
        .catch((error) => {
            var errorCode = error.code;
            var errorMessage = error.message;
            console.log(errorCode, errorMessage)
        });
    }

    render(){
        return(
            <div  className="auth-container"> 
                <div className="auth-card" >
                    <p className="auth-title" >Login Page</p>
                    <input className="input" id="email" placeholder="Email" type="email" onChange={this.handleLoginSubmit}/>
                    <input className="input" id="password" placeholder="Password" type="password" onChange={this.handleLoginSubmit}/>
                    <button className="btn" onClick={this.handleLoginSubmit}>Login</button>
                </div> 
                {/* <button>Go to Dashboard</button>  */}
            </div>
        )
    }
}

export default Login;

【问题讨论】：

标签： javascript reactjs firebase firebase-authentication react-router

【解决方案1】：

您的代码中实际上存在错误。您将一个空字符串传递给signInWithEmailAndPassword()。

首先你要这样做：

state = {
    email:'',
    password:''
}

然后，几乎在此之后，您正在这样做：

    const {email,password} = this.state;
    fireApp.app.auth().signInWithEmailAndPassword(email,password)

您的日志甚至确认您没有电子邮件地址字符串 - 它没有为 email 打印任何内容。

你应该想办法只打电话给signInWithEmailAndPassword，直到你有一个实际的电子邮件地址可以使用。

【讨论】：