React 'Cannot find name: 'title''

React
1

Hey, guys!
I’m having a certain problem. In my code i’ve setted a person variable with a ‘firstName’ inside of it.
When i try to access setPerson inside of my onChange event, it gives me this message. I’m going to leave in the topic my code and a print of the problem.

import React, { FormEvent, useRef, useState } from "react";

function Form() {
  const [person, setPerson] = useState({
    firstName: '',
    age: 0
  });

  function handleSubmit(event: FormEvent){
    event.preventDefault();
  }
  return (
    <form onSubmit={handleSubmit}>
      <div className="mb-3">
        <label htmlFor="name" className="form-label">
          Name
        </label>
        <input onChange={(event) => setPerson({...person}, firstName: event.target.value)} id="name" type="text" className="form-control" />
      </div>
      <div className="mb-3">
        <label htmlFor="age" className="form-label">
          Age
        </label>
        <input id="age" type="number" className="form-control" />
      </div>
      <button className="btn btn-primary" type="submit">
        Submit
      </button>
    </form>
  );
}

export default Form;

image
image1128×300 22.1 KB

2

solved it. the second part of the object was not inside of it xD

3 
#Incorrect -> The 2nd part of destructuring is not enclosed in curl brace

<input onChange={(event) => setPerson({...person}, firstName: event.target.value)} id="name" type="text" className="form-control" />

# Correct

<input onChange={(event) => setPerson({...person, firstName: event.target.value})} id="name" type="text" className="form-control" />