Data undefined in axios response

Im creating a MERN app. The data in the axios post response for my login page is giving me this error

Error with Login ResponseTypeError: Cannot read properties of undefined (reading 'data')

This is my axios post

const login = async (e) => {
    e.preventDefault();

  
    try{
      //urls 
      const loginUrl = "http://localhost:4000/api/user/login";
      const customerUrl = "http://localhost:4000/api/stripe/customer";
      
      let response = await axios({
        method: "post",
        url: loginUrl,
        data: {
          email: loginEmail,
          password: loginPassword
        },
        headers: {
          "Content-Type": "application/json",
          "x-access-token": token, // Set the Content-Type header
        },
      }

    ).then((response) => setShow(true))
    // .then(data => response)
    .catch((error) => console.log("Error with Login Response" + error))

This is what I'm doing for the token and stuff

if (response.data && response.data.token) {
        let token = response.data;
        setToken(token);
        console.log("Login succesful. email: " + email+ "token: " + token)
        const response2 = await axios({
          url: customerUrl,
          data: {
            email: loginEmail,
          },
          headers: {
            "x-access-token": token,
          }
        });
        if (response2) {
          console.log("Customer Data Success")
        } else {
          console.log("Customer Data Failure")
        }

        axios.all([response, response2], axios.spread((response, response2) => {
          console.log("RESPONSE 1: " + response.data)
          console.log("RESPONSE 2:" + response2.data)
        }))
        .catch((error) => {
          console.error("ERROR: " + error)
        });

        // Perform further actions with the token, such as storing it in localStorage or redirecting to a new page

      } else {
        // Handle the case when the token is not present in the response
        console.error("Token not found in response");
      }
    } catch (error) {
      console.log("Error getting data from login" + error);
    }

the backend isn't the problem, I already tested it with postman, The response is logging as undefined too when I console.log

You are using .then() and on an asynchronous invocation. Try using the following to debug what response is.

try {
  const response = await axios({
    // ... your config
  });

  console.log(response); // To debug what the response is.

  if (response?.data) {
    setShow(true);
  } else {
    // Maybe some additional error handling to gracefully handle missing `data`.
  }
} catch (error) {
  console.log(`Error with Login Response ${error}`);
}

Note: This uses optional chaining to check for data on your response object.