Tengo una tabla en mi base de datos fría Apoet en mi campo de tabla podría nombrar, así que trato de traer el nombre de la base de datos, pero cuando ejecuto la aplicación aparece este mensaje
undefined no es un objeto (evaluando abc.name)
debajo de mi código
import React from 'react'; import {useEffect} from 'react'; import {useState} from 'react'; import { useRoute } from '@react-navigation/native'; import { DataStore } from 'aws-amplify'; import { Apoet } from '../../models'; const ProductScreen = () => { const route = useRoute(); console.log(route); const {abc, setABC}= useState<Apoet | undefined>(undefined); useEffect (()=>{ if(!route.params?.id){ return ; } DataStore.query(Apoet,route.params.id).then(setABC) },[route.params?.id]); return ( <View> <Text>{abc.name} </Text> </View> )}Su useState es incorrecto, cambie con corchetes. También asegúrese de que la route cambie como espera, de lo contrario, volverá a estar undefined ya que su valor de estado inicial también está undefined
const [abc, setABC] = useState<Apoet | undefined>(undefined); Ha accedido incorrectamente al valor de retorno del useState , devuelve una matriz, no un objeto.
const {abc, setABC} = useState<Apoet | undefined>(undefined);También usa un valor inicial indefinido, por lo que intentar acceder a él generará un error.
Corrija la asignación de desestructuración de matriz de retorno y uso y use un valor inicial válido.
const [abc, setABC] = useState<Apoet>({}); ... <Text>{abc.name}</Text> abc ahora está definido y puede acceder a una propiedad de name que no estará definida hasta que se actualice el estado.
O si desea mantenerlo indefinido, use una verificación nula o un operador de encadenamiento opcional en el acceso a la propiedad de name .
Ejemplo:
const [abc, setABC] = useState<Apoet | undefined>(); ... <Text>{abc && abc.name}</Text> or <Text>{abc?.name}</Text>