React native android undefined is not a function works in IOS

Question

Works in IOS and works in Android when the debugger is running, but doesn't work via Android Simulator. I get this message via react-native log-android and basically I am just having nothing returned to the screen:

12-02 10:39:58.511 22502 24204 W ReactNativeJS: TypeError: undefined is not a function (near '...}).flat()

Android Picture

IOS Picture

Here is the fetch function I am using:

import axios from 'axios';

export const getData = async url => {
  try {
    const response = await axios.get(url);
    const data = response.data;
    return data;
  } catch (error) {
    console.log(error);
  }
};

export default getData;

Inside of my componentDidMount, where I call the endpoint using the GetData function above:

componentDidMount() {
    const teamsAPI = 'https://statsapi.web.nhl.com/api/v1/teams';

    getData(teamsAPI).then(teams => {
      const teamData = teams.teams
        .map(({ id, name }) => ({
          teamId: id,
          teamName: name
        }))
        .flat()

      this.setState({
        teams: teamData
      });
    });
  }

Everything has since been moved to REDUX, but I looked back at one of my branches today with the more basic code shared above and had the issue back then with this code as well. Unfortunately didn't realize all the differences with code compilations till now. Understand that the issue is probably because of 2 compilers, but have no idea how to approach the issue/ why there would be a type error in one and not the other.

It works with debugger I think due to what was mentioned here:

React Native behavior different in simulator / on device / with or without Chrome debugging

Edit: wanted to mention I've already done a cache reset and deleted the build folder and rebuilt

Answer 1

I tried out your code and the promise rejecting is happing for me in both Android and iOS. It is being caused by the .flat() removing it stops the promise rejection from occurring.

Looking at the data that you are mapping there there doesn't seem to be a need to flatten the data as it comes back as a array of objects with no other arrays inside it.

Could removing the .flat() be a possible solution for you?

You can see here for more information about .flat() and how it is still experimental array.prototype.flat is undefined in nodejs

I would also consider returning something from your getData function when it makes an error or perhaps use a promise with it that way you can handle an error.