New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Type error with react-hook-form (Select component) #642
Comments
I have a similar issue that seems to be related to the react version. I have the same issue with the provided sample pro templates where it's not possible to build however it works when running in developer mode. Depending on which react version that I use, I can get different results and different incopability problems. This is what I get when I use the default version from the blog-tailwind-nextjs sample project. I tested it to first rule out problem in my own code.
|
@bryanlundberg You need to add controller on top of component from react-hook-form. import { FC } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { Option, Select } from "@material-tailwind/react";
export interface IProps {
}
export const ProfileForm: FC<IProps> = () => {
const methods = useForm();
async function onSubmit(data: any) {
console.log("Submit:", data);
}
return (
<FormProvider {...methods}>
<form onSubmit={methods.handleSubmit(onSubmit)}>
<Controller
name="data"
control={methods.control}
render={({ field: { onChange, value } }) => (
<Select
name="data"
label="Select value"
value={value}
onChange={onChange}>
<Option value="demo1">Demo1</Option>
<Option value="demo2">Demo2</Option>
</Select>
)}/>
</form>
</FormProvider>
)
} |
I found an issue trying to use react-hook-form to validate the form, works with input components but not with the select component🤷♂️
Error gotten (select component):
The text was updated successfully, but these errors were encountered: