Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

Unhandled promise rejection: TypeError: undefined is not an object (evaluating 'ejRepository.getWordandMean')

$
0
0

I'm trying to retrieve data from a pre-populated database using TypeORM using Expo, imitating this working example (https://dev.to/jgabriel1/expo-sqlite-typeorm-4mn8). It keeps throwing this error;

[Unhandled promise rejection: TypeError: undefined is not an object (evaluating 'ejRepository.getWordandMean')]at src/components/page/dictionarypage.js:26:41 in useCallback$argument_0at src/components/page/dictionarypage.js:26:41 in useCallback$argument_0at [native code]:null in callFunctionReturnFlushedQueue

Here's my code

/page/dictionarypage.js

export default function DictionaryScreen(){    const { ejRepository } = useDatabaseConnection();    const [inputWord, setinputWord] = useState(""),          [wordData, setwordData] = useState(""),          [meanData, setmeanData] = useState("Word and definitions will appear here");    const handleinputWord = useCallback( async () => {        const results = await ejRepository.getWordandMean({inputWord});                                         //this is where the error is thrown            setwordData(results.word);            setmeanData(results.mean);        }, [inputWord, ejRepository]);    return(<DatabaseConnectionProvider><SafeAreaView style={styles.container}><View style={styles.searchContainer}><MaterialCommunityIcons name="text-search" color="white" size={30}/><TextInput                        style={styles.input}                        onChangeText={(inputWord) =>                            setinputWord(inputWord)}                        onSubmitEditing={handleinputWord}                        value={inputWord}                        placeholder='Look up the word (Type exactly)'                        keyboardType="default"                    /> <StatusBar style='light' /></View><View style={{flex:40, margin:10, alignItems:"center"}}><Text style={{color:'white',fontSize:30,fontWeight:"bold",margin:10}}>                        {wordData}</Text><ScrollView><Text style={{color:'white',fontSize:18}}>                        {meanData}</Text></ScrollView></View><View style={{margin:20, flex:1,alignItems:"center"}}><Text style={{color:"white",fontSize:11}}>                        Data retrieved from ****</Text></View></SafeAreaView></DatabaseConnectionProvider>        );    }

/data/repositories/repository.ts

import { EJmodel } from '../entities/EJmodel';export class EJRepository {  private ormRepository: Repository<EJmodel>;  constructor(connection: Connection) {    this.ormRepository = connection.getRepository(EJmodel);  }  public async getWordandMean(inputWord:{inputWord: String}): Promise<EJmodel> {    const results: EJmodel = await this.ormRepository.query('select * from items where word like ?;',[inputWord],    );      return results;   }

/data/entities/EJmodel.ts

import {Entity, PrimaryColumn, Column} from "typeorm";@Entity('EJentity')export class EJmodel {    @PrimaryColumn({type: 'integer', select: false})    item_id: number;    @Column({type: 'text'})    word: string;    @Column({type: 'text'})    mean: string;    @Column({type: 'integer', select: false})    level: number;    constructor(word: string, mean: string){        this.word = word;        this.mean = mean;    }}

/data/connection.tsx

import React, {createContext, useCallback, useContext, useEffect, useState} from 'react';import { ActivityIndicator } from 'react-native';import { Connection, createConnection } from 'typeorm';import { EJmodel } from './entities/EJmodel';import { ejdict1621603544180 } from './migration/1621603544180-ejdict';import { EJRepository } from './repositories/repository';  interface DatabaseConnectionContextData {    ejRepository: EJRepository;  }  const DatabaseConnectionContext = createContext<DatabaseConnectionContextData>(    {} as DatabaseConnectionContextData,  );  export const DatabaseConnectionProvider: React.FC = ({ children }) => {    const [connection, setConnection] = useState<Connection | null>(null);    const connect = useCallback(async () => {      const createdConnection = await createConnection({        type: 'expo',        name: "ejdict.v1.0",        database: 'ejdictcopy.db',        driver: require('expo-sqlite'),        entities: [EJmodel],        migrations: [ejdict1621603544180],        migrationsRun: true,        synchronize: false,        extra:{          createFromLocation: '/Users/**/**/assets/db/ejdictcopy.db'        }      });      setConnection(createdConnection);    }, []);    useEffect(() => {      if (!connection) {        connect();      }    }, [connect, connection]);    if (!connection) {      return <ActivityIndicator />;    }    return (<DatabaseConnectionContext.Provider        value={{          ejRepository: new EJRepository(connection),        }}>        {children}</DatabaseConnectionContext.Provider>    );  };  export function useDatabaseConnection() {    const context = useContext(DatabaseConnectionContext);    return context;  }

Other files and configurations are pretty much the same as the example shown above.

I reckon the property inputWord is not properly read in the query as a parameter.

Thanks in advance!


Viewing all articles
Browse latest Browse all 6287

Trending Articles