I want when the user start typing inside a input field age from and to property value to get update so i can send the information to the backend.

my onBlur eventhandler dosen't work i get a undefiend: 43(user typed num for exam) property outside of age object on my state;

code

  const [advancedSearch, setAdvancedSearch] = useState({
    selectIdentify: "",
    type: "",
    gender: "",
    age: { from: "", to: "" },
  });

==========================
                   <TextField
                    label="Age From"
                    type="number"
                   onBlur={(e) =>
                      setAdvancedSearch((data) => ({
                        ...data,
                        ["age"["from"]]: e.target.value,
                      }))
                    }
                  />
                  <TextField
                    label="Age To"
                    type="number"
                   onBlur={(e) =>
                      setAdvancedSearch((data) => ({
                        ...data,
                        ["age"["to"]]: e.target.value,
                      }))
                    }
                  />