passing data from child to parent returns undefined is not an object(evaluating 'new _reactNative.ListView.DataSource')

Am trying to pass data from one component(which is a child component) to another component(which is a parent component) using

React native ListView DataSource

which in turn return this error undefined is not an object(evaluating 'new _reactNative.ListView.DataSource')

This is the ListItem component(which is the child component)

import React, { Component } from 'react';
import { Text, TouchableWithoutFeedback } from 'react-native';
import { Icon, Container } from 'native-base';
import moment from 'moment';

class ListItem extends Component {
  constructor(){
    super();
    this.state = {
      attendance: []
    };
  }
  attendee = [{
       courseName: 'comp',
       lecturer: 'Akanbi T.B',
       students: 'Tunde Ajagba',
      date: '10/11/2020',
     },{
       courseName: 'comp',
       lecturer: 'Akanbi T.B',
       students: 'Tunde Ajagba',
      date: '09/11/2020',
     },
     {
       courseName: 'comp',
       lecturer: 'Akanbi T.B',
       students: 'Tunde Ajagba',
      date: '08/11/2020',
     },
     {
       courseName: 'comp',
       lecturer: 'Akanbi T.B',
       students: 'Kola Babatunde',
      date: '09/11/2020',
     },
     {
       courseName: 'comp',
       lecturer: 'Akanbi T.B',
       students: 'Kola Babatunde',
      date: '10/11/2020',
     }
     ];

  onRowPress() {
    this.record = this.attendee.map(function(item,index) {
      alert("item: " + item.courseName + " at index: " + index );
});

    //const { navigate } = this.props.navigation;
    //navigate('attendanceDetails', { record });
  }

  render() {
    return (
      <TouchableWithoutFeedback onPress={this.onRowPress.bind(this)}>
        <Container style={styles.containerStyle}>
          <Text style={styles.labelStyle}>Course:</Text>
          <Text style={styles.titleStyle}>{courseName}</Text> 
          <Text style={styles.labelStyle}>Date:</Text>
          <Text style={styles.titleStyle}>
          </Text>
          <form onSubmit = {this.onTrigger}>
                <input type = "submit" value = "Submit"/>
            </form>
          <Icon name='ios-arrow-forward' style={{ color: 'grey', marginLeft: 5 }} />
        </Container>
      </TouchableWithoutFeedback>
    );
  }
}

export default ListItem;

now, I know there is an error in the onRowPress function as am unable to bring the array to work i the render function(this, I don't know how to do it).

Meanwhile, in the

ViewAttendance component(which is the parent component).

This is what I have

import _ from 'lodash';
import React, { Component } from 'react';
import { ListView, ScrollView } from 'react-native';
import { Container } from 'native-base';
import AsyncStorage from '@react-native-community/async-storage';
import ListItem from './ListItem';


    export default class ViewAttendance extends Component {
      constructor(props){
            super(props);
            
        }
      componentWillMount() {
        const { lecturer } = "Akanbi T.B";//this.props.route.params;
         
        this.createDataSource(this.props);
      }
    
      componentWillReceiveProps(nextProps) {
        this.createDataSource(nextProps);
      }
    
      createDataSource({ records }) { 
        const ds = new ListView.DataSource({
          rowHasChanged: (r1, r2) => r1 !== r2
        });
        const items = _.map(records, (val, key) => {
          return { ...val, key };
        });
        this.dataSource = ds.cloneWithRows(items);
      }
    
      renderRow(record, navigation) {
        return (
          <ListItem record={record} navigation={navigation} />
        );
      }
    
      
      render() {
        const { navigation } = 'a';//this.props.route.params;
        return (
          <Container style={styles.containerStyle}>
          <ListView
                            enableEmptySections
                            dataSource={this.dataSource}
                            renderRow={(record) => this.renderRow(record, navigation)}
                        />
                </Container>
        );
      }
    }
    };

How do I solve the issues at hand?