I am trying to make a login system using states and fetch so that the user can receive his valid token and then put it in storage with Async Storage. I am still in the phase of munication with the API (expressjs). Everything works for the moment when I enter the email and the password I do receive the token in json but I have a warning type error which tells me:

[Unhandled promise rejection: TypeError: f is not a function. (In 'f()', 'f' is undefined)]

My code is very simple for the moment (I have absolutely no idea where it es from):

const onSubmit = () => {
    setLoading(true)
    fetch('http://192.168.1.36:3000/api/users/login', {
      method: 'POST',
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        email: email,
        password: password
      })
    })
    .then((response) => response.json())
    .then((res) => console.log(res))
    .catch((err) => console.log(err))
    .finally(setLoading(false));
  }

I am trying to make a login system using states and fetch so that the user can receive his valid token and then put it in storage with Async Storage. I am still in the phase of munication with the API (expressjs). Everything works for the moment when I enter the email and the password I do receive the token in json but I have a warning type error which tells me:

[Unhandled promise rejection: TypeError: f is not a function. (In 'f()', 'f' is undefined)]

My code is very simple for the moment (I have absolutely no idea where it es from):

const onSubmit = () => {
    setLoading(true)
    fetch('http://192.168.1.36:3000/api/users/login', {
      method: 'POST',
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        email: email,
        password: password
      })
    })
    .then((response) => response.json())
    .then((res) => console.log(res))
    .catch((err) => console.log(err))
    .finally(setLoading(false));
  }

I don't know if the syntax I use with fetch is "good" and "optimize" for a login system, but I hope I was clear enough in my explanation.

Tanks

• javascript
• reactjs
• typescript
• react-native
• fetch

Share Improve this question Follow edited Jan 17, 2021 at 21:39 e-frank 7491111 silver badges2222 bronze badges asked Jan 17, 2021 at 21:15 user15026148user15026148

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

I think this has to do with your finally clause:

.finally(setLoading(false));

The finally function must be passed a function itself. Two ways to do this:

.finally(() => setLoading(false));
.finally(setLoading.bind(undefined, false));