Displaying localhost data in a react native table

For at least a week I've been trying to display data from a list of objects fetched from my localhost. I've tried various tutorials but I can't seem to make it work. My table component code is:

import React, { useEffect, useState } from 'react';
import { StyleSheet, List, ListItem, ActivityIndicator, Text, View, Alert, ScrollView, Component } from 'react-native';
import { Table, Row, Rows } from 'react-native-table-component';
const axios = require('axios')

export class DataList extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [],
    }
  }

  componentDidMount() {
    axios.get('http://10.10.62.234:5000/tabledata')
      .then(res => {
        console.log(res.data)
        let teams = res.data.map(teamdata => {
          return {
            team: teamdata.Team,
            points: teamdata.Points,
          }
        });
        this.setState({ data: teams });
      })
  }


  render() {
    const tableHead = ['Team', 'P'];
    const widthArr = [70, 60];
    const state = this.state;

    return (
      <View style={styles.container} >
        <ScrollView horizontal={true}>
          <View>
            <Table borderStyle={{ borderColor: '#C1C0B9' }}>
              <Row data={tableHead} widthArr={widthArr} style={styles.header} textStyle={styles.headerText} />
            </Table>
            <ScrollView style={styles.dataWrapper}>
              <Table borderStyle={{ borderColor: '#C1C0B9' }}>
                <Rows data={state.data} flexArr={[1, 2, 1, 1]} widthArr={widthArr} style={styles.row}
                  textStyle={styles.text} />
              </Table>
            </ScrollView>
          </View>
        </ScrollView>
      </View>
    )
  }
}

The data from the localhost is in the format [{_id: ..., Team: ..., Points: ...}] with many objects inside the array. However, I am getting the error Undefined is not a function (near '...data.map...`) And in the console, there is 260 of these error messages shown, and there are 260 objects in the array. Also, the data is printed in the console so I know that fetching the data isn't an issue, and that it's in the right format (list of objects). In addition to the 260 similar errors logged, the emulator shows 2 warnings: 'Can't perform a react state update on an unmounted component. This is a no-op, but it indicates a memory leak...' and 'Possible Unhandled Promise Rejection (id: 1)'.

However, if I nest the data in another array: this.setState({ [data]: teams }); The 260 errors disappear and get replaced with another: Possible Unhandled Promise Rejection (id: 0): ReferenceError: Can't find variable: data (But the console still logs all the data from console.log correctly)