How to pass arguments in useFormState in server action?
Unanswered
Almond stone wasp posted this in #help-forum
Almond stone waspOP
I am trying to pass an argument using useFormState
// getting this error
const EmailForm = () => {
const initialState = {errors : {}, message : null, data : undefined};
const SendEmail = sendEmail.bind(null, selectLink );
const [state, formAction] = useFormState(SendEmail, initialState);
return(
<form action={SendEmail}>
//////
//////
</fomr>
)
}
export type State = {
errors?: {
from ?: string[] | undefined;
to ?: string[] | undefined;
subject?: string[] | undefined;
message?: string[] | undefined;
};
message?: string | null;
data : undefined;
}
// action
export async function sendEmail(selectLink : string, prevState : State, formData : FormData){
const validateFields = sendEmailFormSchema.safeParse({
from : formData.get('from'),
to : formData.get('to'),
subject : formData.get('subject'),
message : formData.get('message'),
})
}
// getting this error
o overload matches this call.
Overload 1 of 2, '(action: (state: Error | { errors: { to?: string[] | undefined; from?: string[] | undefined; message?: string[] | undefined; subject?: string[] | undefined; }; message: string; data: undefined; } | { ...; } | { ...; }) => Error | ... 3 more ... | Promise<...>, initialState: Error | ... 2 more ... | { ...; }, permalink?: string | undefined): [state: ...]', gave the following error.
Argument of type '(prevState: State, formData: FormData) => Promise<Error | { errors: { to?: string[] | undefined; from?: string[] | undefined; message?: string[]
3 Replies
like you did
the error is complaining the typeof state
try
const EmailForm = () => {
const SendEmail = sendEmail.bind(null, selectLink );
const initialState = {errors : {}, message : null, data : undefined} as Awaited<ReturnType<typeof SendEmail>>;
const [state, formAction] = useFormState(SendEmail, initialState);
return(
<form action={SendEmail}>
//////
//////
</fomr>
)
}