React Js - Uncaught TypeError: Eigenschaften von undefined können nicht gelesen werden

Ich habe ein Datenraster in ReactJS, das ich mit Daten füllen muss, die durch Zusammenführen von Daten aus drei Tabellen entnommen wurden. Der erste enthält die Indizes und die anderen beiden sind die anzuzeigenden Elemente. Unten ist der Code zum Auffüllen der Rasterlinien

const datiRighe = vocibilancio.map(voci => {
 const lista = listaattivita.find(elemento => elemento.id_lista_attivita === 
 voci.id_gruppo_att)
 const listasub = listasubattivita.find(elementosub => 
 elementosub.id_lista_sub_group === voci.id_sub_group_att)
 console.log("lista:", lista);
 console.log("listasub:", listasub);
 console.log("voci: ", voci);
 return {
 id: voci.id_voce_bilancio,
 idGruppoAtt: lista.denominazione,
 idSubGroupAtt: listasub.denominazione_sub,
 descrizioneVoceBilancio: voci.descrizione_voce_bilancio,
 totaleVoceBilancio: voci.totale_voce_bilancio,
 createdAt: voci.createdAt,
 updatedAt: voci.updatedAt,
 };
}, []);

in den drei console.log erhalte ich die daten die ich aber aus irgendeinem grund erwarte lista.denominazioneund listasub.denominazione_subnicht abrufbar bin.

Dies ist zum Beispiel der console.logvon lista:

{
 "id_lista_attivita": 1,
 "denominazione": "Uscite da attività di interesse generale",
 "tipo": 0,
 "createdAt": "2022-04-12",
 "updatedAt": "2022-04-12"
}

Dies ist der Fehler, den ich erhalte:

Uncaught TypeError: Eigenschaften von undefined können nicht gelesen werden (Lesen von 'denominazione')

Hier ist ein Screenshot.
Geben Sie hier die Bildbeschreibung ein

Ich verstehe nicht, wo ich falsch liege. Ich bitte um Hilfe, danke!

Lösung des Problems

Diese Werte sind undefined:

const lista = listaattivita.find(elemento =>
 elemento.id_lista_attivita === voci.id_gruppo_att);
const listasub = listasubattivita.find(elementosub => 
 elementosub.id_lista_sub_group === voci.id_sub_group_att);

Dies geschieht, wenn keine übereinstimmenden Werte gefunden werden. Die Frage ist also, wie wollen Sie mit dem Fall umgehen, wenn dies der Fall ist undefined?

Beispielsweise können Sie beim Zurückgeben des Ergebnisses nullish-checking verwenden:

return {
 id: voci.id_voce_bilancio,
 idGruppoAtt: lista?.denominazione, // <--- here
 idSubGroupAtt: listasub?.denominazione_sub, // <--- and here
 descrizioneVoceBilancio: voci.descrizione_voce_bilancio,
 totaleVoceBilancio: voci.totale_voce_bilancio,
 createdAt: voci.createdAt,
 updatedAt: voci.updatedAt,
};

Dies würde dazu führen, dass die Eigenschaften idGruppoAttund idSubGroupAttim nullzurückgegebenen Ergebnis enthalten sind. Möglicherweise müssen Sie auch an nullanderer Stelle in Ihrem Code mit Werten umgehen.

Oder vielleicht möchten Sie einige Standardwerte zurückgeben oder einen Fehler oder etwas anderes auslösen. Es liegt an dir. Der Punkt ist, dass .find() möglicherweise zurückgegeben wird, undefinedwenn der Wert nicht gefunden wird, also müssen Sie nur dieses Szenario handhaben.