Reactjs 如果我使用 formik，如何在嵌套对象中写入正确的值

给定一个数组，其字段的名称与Form对象中的名称匹配，我试图编写一个嵌套值，但由于某种原因，Formik不知道如何编写嵌套值，这只适用于从顶层开始的值​​

我会在 comments 中留下codesandbox的链接

export default function App() {
  const form = useFormik({
    initialValues: {
      name: "",
      login: "",
      about: {
        age: "",
        rank: "",
        car: {
          name: "",
          years: ""
        }
      }
    }
  });

  const fields = [
    {
      name: { title: "Your name", fields: {} },
      login: { title: "Your login", fields: {} },
      about: {
        title: "About",
        fields: {
          age: { title: "Your age", fields: {} },
          rank: { title: "Your rank", fields: {} },
          car: {
            title: "Your car",
            fields: {
              name: { title: "Car name", fields: {} },
              years: { title: "Car years", fields: {} }
            }
          }
        }
      }
    }
  ];
  const { values, handleChange } = form;

  console.log("VALUES", values);

  const itemsRender = (item, idx) => {
    const key = Object.keys(item).at(-1);
    return (
      <div key={idx}>
        <p>{item[key]?.title}</p>
        <input
          name={key}
          value={values[key]}
          onChange={handleChange}
          placeholder={item[key].title}
        />

        {!isEmpty(item[key]?.fields) && (
          <div style={{ marginLeft: 20 }}>
            {Object.entries(item[key]?.fields).map(itemsRender)}
          </div>
        )}
      </div>
    );
  };

  return <>{fields.map(itemsRender)}</>;
}