gpt4 book ai didi

javascript - 为 React Hook Form 和 watch() 自定义 onChange

转载 作者:行者123 更新时间:2023-12-05 01:28:35 24 4
gpt4 key购买 nike

我正在尝试编写一个自定义的 onChangewatch 更改。

错误:

监视的 myValue 不会在下拉列表中注册更改。有什么想法吗?

根据API documentation , 这可以通过执行以下操作来实现:

export default function App() {
const { register, watch } = useForm();

const fruits = register("fruits");

const myValue = watch("fruits", "default");

return (
<div className="App">
<h1>{myValue}</h1>
<select
onChange={(e) => {
fruits.onChange(e); // react hook form onChange
console.log("Here would go the my onChange"); // my onChange
}}
onBlur={fruits.onBlur}
ref={fruits.ref}
>
<option value="1Banana">Banana</option>
<option value="1Kiwi">Kiwi</option>
<option value="1Mango">Mango</option>
</select>
</div>
);
}

你可以在这里找到上面的例子:

https://codesandbox.io/s/divine-rgb-mwiqn?file=/src/App.js

最佳答案

您没有将 name Prop 传递给您的 select。文档说你应该默认这样做:

<select {...register('fruits')}>

如果您记录 register('fruits') 返回的内容,您会在 onChange 之外看到一个 name prop, onBlurref。如果您将 name={fruits.name} 添加到您的 select,您将看到 watch 也在工作。

编辑:是的,目前文档中也缺少此内容。

关于javascript - 为 React Hook Form 和 watch() 自定义 onChange,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68438351/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com