Search code examples
react-nativetypeerrorundefined

Getting TypeError: undefined is not a function - Each time I Ctrl + Save, it goes, and next time Ctrl + S it comes back

Getting this error - TypeError: undefined is not a function.this error is coming because of component, but I am not sure why. Thanks in advance !!. I have removed styles for clarity of code. Counter is a react-native component - https://www.npmjs.com/package/react-native-countdown-component

It is used to show timer counter.like this - enter image description here Error - enter image description here

Code -

 import React, {useState, useEffect} from 'react';
import {
  View,
  Text,
  StyleSheet, FlatList, ActivityIndicator, TouchableOpacity, Image, RefreshControl
} from 'react-native';
import {fetchUserSessions, fetchMoreUserSessions} from '../data/apiService.js';
import Home2 from './Home2.js';
import Animation from './AnimationTry';
import Lottie from 'lottie-react-native';
import { picFunction } from '../data/profiledata';
import CountDown from 'react-native-countdown-component';

const Home = ({navigation}) => {
    const [sessions,setSessions] = useState(new Array());
    const [refreshing, setRefreshing] = useState(false);

    const getUserSessions = async () => {
      const nowDateTime = new Date();
      const sessionsData = await fetchUserSessions(nowDateTime);
      setSessions([...sessions, ...sessionsData.sessionArray])
    }

    const reloadget = async () => {
      const nowDateTime = new Date();
      const sessionsData = await fetchUserSessions(nowDateTime);
      setSessions([...sessionsData.sessionArray])
      // setStartAfter(sessionsData.lastVisible)
      setRefreshing(false);
    }

    const SPACING = 20
    const AVATAR_SIZE = 60

    const RenderCard = ({item})=>{
        return(
          <TouchableOpacity onPress={()=> navigation.navigate('Home2', {item})}>
          <View>
          <View>
           <Image source={picFunction(item.type)} />
            <View>
              <Text>{item.name}</Text>
              <Text>{item.title}</Text>
              <Text>{item.type}</Text>
              <CountDown until={2000} size={20} style={{marginTop: 10}} />
             </View>
           </View>    
            </View>
          </TouchableOpacity>
        )
      }
 
    return(
      <View style={styles.container}>
        {refreshing ? <ActivityIndicator /> : null}
        <FlatList
          data={sessions}
          renderItem={({item})=><RenderCard item={item} />}
          keyExtractor={(item, id)=>String(id)}
          refreshControl={
            <RefreshControl refreshing={refreshing} onRefresh={reloadget} />
          }
       />
      </View>
      );
}

export default Home
Solution

  • I am now using this package instead the above package - react-native-countdown-timer-hooks Above package is old, not using it.