Reagieren Sie mit Beispielcode zur Implementierung des Anmeldeformulars

importiere React von „react“;
importiere { Eingabe, Schaltfläche, Nachricht } von "antd";
importiere { UserOutlined, LockOutlined, EyeInvisibleOutlined, EyeTwoTone } aus '@ant-design/icons';
importiere './index.less'
Klasse Login erweitert React.Component{
 Konstruktor(Requisiten) {
 super(Requisiten)
 dieser.Zustand = {
 Benutzername: '',
 Passwort: ''
 }
 };
 senden=()=>{
 wenn (dieser.Zustand.Benutzername !== '' && dieses.Zustand.Passwort !== '') {
 dies.props.history.push('/Index')
 } anders {
 message.error("Benutzername und Passwort dürfen nicht leer sein")
 }
 };
 Benutzeränderung=(e)=>{
 dies.setState({
 Benutzername: e.Ziel.Wert
 })
 }
 password_change=(e)=>{
 dies.setState({
 Passwort: e.target.value
 })
 }
 rendern () {
 const {Benutzername, Passwort} = this.state
 zurückkehren (
 <div Klassenname="Anmelden">
  <Eingabe
  Wert={Benutzername}
  beiÄnderung={dieser.Benutzer_Änderung}
  Größe="groß"
  Platzhalter="Benutzername"
  Präfix={<UserOutlined />} />
  <Eingabe.Passwort
  Wert={Passwort}
  beiÄnderung={dieses.Passwort_ändern}
  Größe="groß"
  Klassenname="login__input"
  Platzhalter="Passwort"
  Präfix={<LockOutlined />}
  iconRender={sichtbar => (sichtbar ? <EyeTwoTone /> : <EyeInvisibleOutlined />)}
  />
  <Schaltfläche
  Klassenname="login__btn"
  Größe="groß"
  Typ="primär"
  beiKlick={this.submit}
  >
  Anmelden</Button>
 </div>
 );
 }
}  
Standard-Login exportieren;