mirror of
https://github.com/cupcakearmy/formhero.git
synced 2024-12-23 00:26:23 +00:00
Update README.md
This commit is contained in:
parent
6070ee2227
commit
e4fc2347c6
29
README.md
29
README.md
@ -164,6 +164,35 @@ const Form = () => {
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
### Dynamic Fields
|
||||||
|
|
||||||
|
Sometimes you don't know all the fields upfront. You can simply define a generic type and assign it to the initial object. Of course type assistance is limited in this case as formhero cannot be sure what keys are valid.
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import React from "react";
|
||||||
|
import ReactDOM from "react-dom";
|
||||||
|
import { useForm } from "formhero";
|
||||||
|
|
||||||
|
type MyForm = { [field: string]: string | number };
|
||||||
|
|
||||||
|
const init: MyForm = {
|
||||||
|
username: "unicorn",
|
||||||
|
password: ""
|
||||||
|
};
|
||||||
|
|
||||||
|
const Form: React.FC = () => {
|
||||||
|
const { field, form, errors } = useForm(init);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<form>
|
||||||
|
<input {...field("username")} placeholder="Username" />
|
||||||
|
<input {...field("someother")} placeholder="Something else" />
|
||||||
|
<input {...field("password")} placeholder="Password" type="password" />
|
||||||
|
</form>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
```
|
||||||
|
|
||||||
## 📖 Documentation
|
## 📖 Documentation
|
||||||
|
|
||||||
### `useForm`
|
### `useForm`
|
||||||
|
Loading…
Reference in New Issue
Block a user