Clear form input on submit

[ItsMeViipeR]

How to clear the input after submiting the stuff?

<AutoForm formSchema={formSchema} onSubmit={addTodo}>
    <AutoFormSubmit />
</AutoForm>

const [todos, setTodos] = useState([] as Todo[]);
  const [done, _setDone] = useState(false);
  const [loading, setLoading] = useState(true);

  const loadTodos = () => {
    const storedTodos = JSON.parse(localStorage.getItem("todos") || "[]");
    setTodos(storedTodos);
    setLoading(false);
  };

  useEffect(() => {
    loadTodos(); // Appel de la fonction pour charger les todos depuis le stockage local
  }, []);

  function addTodo(event: TodoFormResult) {
    // Add the new todo to the list
    const newTodo = { text: event.todo, done, id: Date.now() };
    const updatedTodos = [...todos, newTodo];
    setTodos(updatedTodos);

    // Save the updated list to local storage
    localStorage.setItem("todos", JSON.stringify(updatedTodos));
  }

[vantezzen]

You should be able to use the controlled form data (https://github.com/vantezzen/auto-form#controlled-form) to clean and modify fields

[ItsMeViipeR]

But that doesn’t explain how to delete the input content.

[vantezzen]

You should be able to do something like:

const formSchema = z.object({
  username: z.string()
});

const [values, setValues] = useState<Partial<z.infer<typeof formSchema>>>({});

<AutoForm values={values} onValuesChange={setValues} 
onSubmit={() => {
  setValues({
    username: "",
  });
}}
/>;