> ## Documentation Index
> Fetch the complete documentation index at: https://use-any-hook-d92674ab.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# useForm

> Manage form state and handle form changes with useForm.

#### **Install**

```bash npm theme={null}
npm i use-any-hook
```

#### **Description**

The `useForm` hook simplifies the management of form state in React applications. It provides an easy way to handle form input changes, reset the form, and access the current form values. This hook is particularly useful in scenarios where you need to manage complex forms with multiple fields, offering a clean and reusable solution.

#### **Parameters**

| Name          | Type   | Description                                                                                              |
| ------------- | ------ | -------------------------------------------------------------------------------------------------------- |
| initialValues | object | An object representing the initial values of the form fields. Each key corresponds to a form field name. |

#### **Return Values**

| Name         | Type            | Description                                                                                                  |
| ------------ | --------------- | ------------------------------------------------------------------------------------------------------------ |
| values       | object          | The current state of the form values. Each key corresponds to a form field name and holds the current value. |
| handleChange | (event) => void | A function to handle input changes and update the form state accordingly.                                    |
| resetForm    | () => void      | A function to reset the form values to their initial state.                                                  |

#### **Example**

```javascript useForm.example.tsx theme={null}
import { useForm } from "use-any-hook";

function MyComponent() {
  const { values, handleChange, resetForm } = useForm({
    username: "",
  });

  const handleSubmit = (e) => {
    e.preventDefault();
    // Use the form values for submission
    console.log("Submitted data:", values);
  };

  return (
    <form onSubmit={handleSubmit}>
      <input
        type="text"
        name="username"
        value={values.username}
        onChange={handleChange}
        placeholder="Username"
      />

      <button type="submit">Submit</button>
      <button type="button" onClick={resetForm}>
        Reset
      </button>
    </form>
  );
}
```