How to query while inside a function?
I have a handleSubmit function called by a form. I have a query built that works, but I don’t know how to access it while I’m inside of a function. I know the query works because I can hardcode and use a stand alone useQuery but I can’t figure out the syntax/command to use while inside of a function to call it with an arg. I’m using TanStack.
Clarification: the query does a check for some business logic which is why I’m doing it inside of the handleSubmit. The rest of the handleSubmit depends on the result of this initial query.
Do I need to do this more sequentially instead of all inside one function? Get the form element I need and make it a const then pass that to a query, then call that from inside the handle form?
4 Replies
Thanks for posting in <#1088161997662724167>.
Reminder: If you have a Convex Pro account, use the Convex Dashboard to file support tickets.
- Provide context: What are you trying to achieve, what is the end-user interaction, what are you seeing? (full error message, command output, etc.)
- Use search.convex.dev to search Docs, Stack, and Discord all at once.
- Additionally, you can post your questions in the Convex Community's <#1228095053885476985> channel to receive a response from AI.
- Avoid tagging staff unless specifically instructed.
Thank you!
@Corbi-Wan Kenobi I dont' follow, are you just trying to run a query or a mutation?
Just a query.
Can't use useQuery here, invalid hook.
export function LoginForm() {
const [email, setEmail] = useState("");
const [message, setMessage] = useState("");
const handleSubmit = async (e: React.FormEvent) => {
e.preventDefault();
const result = useQuery(api.personEmails.checkCanLogin, { emailAddress: email });
if (!result?.canLogin) {
setMessage(result?.message ?? "An error occurred");
} else {
setMessage("Login successful!");
}
};
return ( form hereconst convex = useConvex() and then in your function you can call await convex.query(...)