react query useMutation typescript getting error on args

Question

I try to use react query useMutation with typescript and still getting error on args when i want to trigger my function. I'm new in typescript i try to googled, and on stackoverflow also give me infomation how to type useMutation. But i still do not understand why i'm getting error TS2345: Argument of type 'string' is not assignable to parameter of type 'Login'

interface Login{
    username: string,
    password: string

}

interface Token{
    access_token: string,
    refresh_token: string
}


const loginToServer = useMutation<Token, unknown,  Login>(newLogin => axios.post(url, {
        username: username,
        password: password
    }),
)


<Button label="Sign In" icon="pi pi-user" 
       onClick={() => loginToServer.mutate(username, password)}/> // revieve an error TS2345: Argument of type 'string' is not assignable to parameter of type 'Login'.

Dave Meehan · Accepted Answer · 2022-06-26 07:48:53Z

2

You need to pass your variables to mutate as an object of shape Login, so wrap your username, password in { and }).

<Button label="Sign In" icon="pi pi-user" 
       onClick={() => loginToServer.mutate( { username, password } )}/>

answered Jun 26, 2022 at 7:48

Dave Meehan

3,2231 gold badge19 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

react query useMutation typescript getting error on args

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related