未能构造&#39；表单数据：参数1不是&#39；HTMLFormElement&#39；。为什么？

当我运行代码时，会出现这个js错误。我想将表单的值保存在数据中。

未处理的运行时ErrorTypeError:未能构造“FormData”：参数1不是“HTMLFormElement”类型。

我在此代码中使用formData

const handleSubmit = (e) => {
    e.preventDefault();
    console.log(e.target);
    var data = new FormData(e.target);

并呈现如下代码

<form className='signup-form' onSubmit={handleSubmit}>
                            <div className='form-group'>
                                <label>{translations[language]['g29']}*</label>
                                <input
                                    type='text'
                                    className='form-control'
                                    placeholder={translations[language]['g91']}
                                    id='name'
                                    required={true}
                                    name='name'
                                    data-error='Please enter your name'
                                />
                            </div>
                            <div className='form-group'>
                                <label>{translations[language]['g61']}*</label>
                                <input
                                    type='text'
                                    className='form-control'
                                    placeholder={translations[language]['g92']}
                                    id='surname'
                                    required={true}
                                    name='surname'
                                    data-error='Please enter your Surname'
                                />
                            </div>

                            <div className='form-group'>
                                <label>{translations[language]['g24']}*</label>
                                <input
                                    type='email'
                                    className='form-control'
                                    placeholder={translations[language]['g42']}
                                    id='email'
                                    required={true}
                                    name='email'
                                />
                            </div>

                            <div className='form-group'>
                                <label>{translations[language]['g43']}*</label>
                                <input
                                    type='password'
                                    className='form-control'
                                    placeholder={translations[language]['g44']}
                                    id='password'
                                    required={true}
                                    name='password'
                                />
                            </div>
                            <div className='form-group'>
                                <label>{translations[language]['g43']}*</label>
                                <input
                                    type='password'
                                    className='form-control'
                                    placeholder={translations[language]['g93']}
                                    id='passwordControl'
                                    required={true}
                                    name='passwordControl'
                                />
                            </div>
                            <div className='form-group'>
                                <label>{translations[language]['g94']}</label>
                                <div style={{ display: 'flex' }}>
                                    <div style={{ marginRight: '8px', display: 'flex', alignItems: 'center' }}>
                                        <input
                                            type='radio'
                                            style={{ marginRight: 6 }}
                                            //className={styles.check_input}
                                            name='gender'
                                            id="female"
                                            required={true}
                                        />
                                        <div>{translations[language]['g95']}</div>
                                    </div>

                                    <div style={{ marginRight: '8px', display: 'flex', alignItems: 'center' }}>
                                        <input
                                            type='radio'
                                            style={{ marginRight: 6 }}
                                            // value={!gender}
                                            //className={styles.check_input}
                                            name='gender'
                                            id="male"
                                            required={true}
                                        />
                                        <div>{translations[language]['g96']}</div>
                                    </div>
                                    <div style={{ display: 'flex', alignItems: 'center' }}>
                                        <input
                                            type='radio'
                                            style={{ marginRight: 6 }}
                                            // value={!gender}
                                            //className={styles.check_input}
                                            name='gender'
                                            id="other"
                                            required={true}
                                        />
                                        <div>{translations[language]['g97']}</div>
                                    </div>
                                </div>
                            </div>
                           
         
              <button onClick={handleSubmit} type='submit' className='btn btn-primary'>
                {translations[language]['g53']}
              </button>
              <Link href='/'>
                <a className='return-store'>{translations[language]['g51']}</a>
              </Link>
            </form>

当我按下注册按钮时，我遇到了一个错误，但我找不到原因。