/
parseFormatInputValues.tsx
48 lines (40 loc) 路 1.07 KB
/
parseFormatInputValues.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
import React from 'react';
import { Controller, useForm } from 'react-hook-form';
const ParseFormatTextarea = ({ value = [], onChange }) => {
const [text, setText] = React.useState(value);
const handleChange = (e) => {
const value = e.target.value.split('\n');
setText(e.target.value);
onChange(value);
};
return <textarea onChange={handleChange} value={text} />;
};
export default function App() {
const { control, handleSubmit } = useForm();
const onSubmit = (data) => {
console.log(data);
};
return (
<form onSubmit={handleSubmit(onSubmit)}>
<Controller
name="emails"
render={ParseFormatTextarea}
control={control}
defaultValue={[]}
/>
<Controller
name="number"
render={({ value, onChange }) => (
<input
type="number"
value={value}
onChange={(e) => onChange(parseInt(e.target.value, 10))}
/>
)}
control={control}
defaultValue={0}
/>
<button type="submit">Submit</button>
</form>
);
}