This is my code but couldnt find any solution , the data got uploaded in firebase , and authentication deatils my email id and details is there but , while trying to login it shows the eeror and i cant find any solution , tried with trim() function , but didnt work . so please try to help

My Code

import React ,{useState,useContext}from 'react';
import FirebaseContext from '../../store/FirebaseContext.js'

import './Login.css';
import {useHistory} from "react-router-dom"
[![Screen Shot for the error message][1]][1]

function Login() {
  const history=useHistory()
  const [password,setPassword]=useState('')
  const [email,setEmail]=useState('')
  const {firebase}=useContext(FirebaseContext) 
  const handleLogin=(e)=>{
    e.preventDefault()
    firebase.auth().signInWithEmailAndPassword(email.trim(),password)
    .then(()=>{
      alert('LoggedIn')
      history.push("/")
    })
    .catch((error)=>{
      alert(error.message)
    })

  }
  return (
    <div className='backdrop'>
      <div className="loginParentDiv">
        <img className='login-logo' src="https://t4.ftcdn.net/jpg/03/77/48/55/360_F_377485593_QHN6cjoNsNdOBoJNOwVRlFcHyZ0M9n3P.jpg"></img>
        <br />
        <form onSubmit={handleLogin}>
          <label htmlFor="fname">Email</label>
          <br />
          <br />
          <input
            className="input"
            type="email"
            
            name="email"
            placeholder='[email protected]'
          />
          <br />
          <br />
          <label htmlFor="lname">Password</label>
          <br />
          <br />
          <input
            className="input"
            type="password"
            id="lname"
            name="password"
            placeholder=''
          />
          <br />
          <br />
          <button>Login</button>
        </form>
        <a href='/signup'>Signup</a>
      </div>
    </div>
  );
}

export default Login;

My Code

CodePudding user response：

You don't have an onChange method in your inputs. Check you are receiving your email in your state with a console.log first.

try this

          <input
            className="input"
            type="email"
            onChange={(e) => setEmail(e.target.value)}
            name="email"
            placeholder='[email protected]'
          />