घटना है.preventDefault( ) काम नहीं कर रहा है में प्रतिक्रिया

प्राप्त करने में असमर्थ मूल्यों में सांत्वना देने के लिए! क्या मैं यह कर रहा हूँ गलत?

नीचे संलग्न है कार्यात्मक घटक की प्रतिक्रिया

हैंडलर कार्य

import React, { useState, useRef } from 'react';

const SimpleInput = (props) => {
  const nameInputRef = useRef();
  const [enteredName, setEnteredName] = useState('');

  const nameInputChangeHandler = (event) => {
    setEnteredName(event.target.value);
  };

  const formSubmissionHandler = (event) => {
    event.preventDefault();
    console.log(enteredName);

    const enteredName = nameInputRef.current.value;
    console.log(enteredName);
  };

JSX कोड

  return (
    <form>
      <div className="form-control" onSubmit={formSubmissionHandler}>
        <label htmlFor="name">Your Name</label>
        <input
          ref={nameInputRef}
          type="text"
          id="name"
          onChange={nameInputChangeHandler}
        />
      </div>
      <div className="form-actions">
        <button>Submit</button>
      </div>
    </form>
  );
};

export default SimpleInput;