Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/reporting-services/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 以react钩子形式更改输入_Javascript_Reactjs_Forms_React Hook Form - Fatal编程技术网

Javascript 以react钩子形式更改输入

Javascript 以react钩子形式更改输入,javascript,reactjs,forms,react-hook-form,Javascript,Reactjs,Forms,React Hook Form,我正在使用React和library构建webapp。我想创建一个表单,其中一些字段的更改会触发一些事件。所以我需要通过customonChange 但是,由于v7.0,我不能使用onChange,因为register使用自己的onChange import React from 'react' import { useForm } from 'react-hook-form' const MyForm = () => { const form = useForm() cons

我正在使用React和library构建webapp。我想创建一个表单,其中一些字段的更改会触发一些事件。所以我需要通过custom
onChange

但是,由于v7.0,我不能使用
onChange
,因为
register
使用自己的
onChange

import React from 'react'
import { useForm } from 'react-hook-form'

const MyForm = () => {

  const form = useForm()
  const onChangeFirst = value => console.log('First:', value)
  const onChangeSecond = value => console.log('Second:', value)

  return (
    <form onSubmit={form.handleSubmit(vals => null)}>
      <input {...register('first')} />
      <input {...register('second')} />
    </form> 
  )

}

从“React”导入React
从“react hook form”导入{useForm}
常量MyForm=()=>{
const form=useForm()
const onChangeFirst=value=>console.log('First:',value)
const onChangeSecond=value=>console.log('Second:',value)
返回(
空)}>
)
}

如何将
onChangeFirst
传递到
first
输入和
onChangeFirst
传递到
second
输入?

在输入更改时,有两种方法触发
onChange

1/带组件(重新安装)


有两种方法可以在输入更改时触发更改

1/带组件(重新安装)

const onChangeFirst = value => console.log('First:', value)

<Controller
  control={control}
  name="first"
  render={({field}) => (
    <input {...field} onChange={e => {
      onChangeFirst(field.value);
      field.onChange(e);
    }} />
  )}
/>
 const second = useWatch({
    control,
    name: 'second'
 });

 useEffect(() => {
   console.log('Second:', second)
 }, [second])