Блог

Главная - Вопросы по программированию - параметр handlesubmit не определен, когда я пишу код в функциональном компоненте react

параметр handlesubmit не определен, когда я пишу код в функциональном компоненте react

#reactjs #forms

#reactjs #формы

Вопрос:

вот код для компонента register, в котором я написал с использованием функциональных компонентов react. чего мне не хватает, состояния реакции? код приведен ниже.

 import React, {useState} from 'react'
import './Register.css'
import axios from 'axios'

function Register() {
const [name, setName] = useState('');
const [email, setEmail] = useState(''); 
const [password, setPassword] = useState(''); 
const [confirmPassword, setConfirmPassword] = useState(''); 

     const handleSubmit = (e) => {
        e.preventDefault();
        const data = {name , email, password, confirmPassword};
     
        console.log('data');
       
     }
     
    return (
        <div className="signup__container">

            <div className="signup__containerInfo">
            <h1 className="h1__swari">सवारी नविकरणको लागि</h1>
            <hr />
            </div>


<form4 onSubmit={handleSubmit}>
<h5 className="h5__form"> Name</h5>
<input type="text" placeholder="पुरा नाम लेख्नुहोस्"  value={name} onChange={e => setName(e.target.value)}/>
<h5 className="h5__form"> Email-Address </h5>
<input type="Email" placeholder="ईमेल लेख्नुहोस्" value={email} onChange={e => setEmail(e.target.value)}/>
<h5 className="h5__form"> Password </h5>
<input type="Password" placeholder="पासवर्ड लेख्नुहोस्s" value={password} onChange={e => setPassword(e.target.value)}/>
<h5 className="h5__form"> Confirm Password </h5>
<input type="Password" placeholder="पुन: पासवर्ड लेख्नुहोस्" value={confirmPassword} onChange={e => setConfirmPassword(e.target.value)} />
<p>
<button type="submit" className="signup__registerButton" >Register Now</button>
</p>
</form4>
        </div>
    )
    }

export default Register

Я думаю, что весь код хорош, но только дескриптор отправки сообщает об ошибке. я новичок в react, пожалуйста, помогите.

Комментарии:

1. Не только у вас отсутствует состояние, такого HTML-элемента нет form4

2. Вы напрямую изменяете состояния, а не позволяете React позаботиться об этом??

3. Пожалуйста, определите const [name,setName] = useState(''); , а затем onChange={e=>setName(e.target.value)} . В противном случае вы изменяете состояния, что не является практикой.

4. существует несколько форм, которые я устал указывать им номер

5. @Ankush Verma я добавил, как и сказал, по-прежнему получаю ту же ошибку. можете ли вы показать, что закодированное решение было бы большой помощью !.

Ответ №1:

Строка 7 должна быть

 const handleSubmit = (e) => {

Комментарии:

1. ошибок нет, но я не могу распечатать данные в консоли, что является основной целью этой программы, из формы регистрации.