Reagieren + Firebase mit Click-Ereignis nicht definiert

Question

Hoffentlich ist dies eine schnelle Lösung. Im Wesentlichen habe ich onClick-Listener für einige Elemente einer untergeordneten Komponente festgelegt, und wenn sie geklickt werden, wird eine Funktion von der Hauptkomponente ausgeführt. Alles funktioniert gut, bis wir eine bestimmte Zeile im Aufruf der Firebase-Datenbank treffen, wo ich Probleme mit undefiniert bekomme. Ich habe dem unten stehenden Code Kommentare hinzugefügt, damit Sie genau wissen, was vor sich geht.

getDataName(event) { 
    var title; 
    var that = this; 
    // Grabs data name attribute from element clicked 
    var grabIdentifier = event.target.getAttribute('data-name'); 
    console.log(grabIdentifier); // prints "cruise" 

    // Call to firebase 
    var greeting = database.ref('events/travel'); 
     greeting.once('value').then(function(snapshot) { 
     console.log(grabIdentifier); // prints "cruise" 

     // Set title to value of the "cruise" key. 
     title = snapshot.val().grabIdentifier; 
     console.log(title); // prints "undefined" =(

     that.setState({ 
     greeting : title 
     }); 
    }); 
    } 

Die Idee dabei ist, den Zustand auf den Text zu setzen, als ein Wert unter dem Schlüssel „cruise“ in der Feuerbasis db gespeichert wird. Stuped!

Es könnte auch zu erwähnen, dass helfen, wenn ich die folgende Zeile umschreiben, und tatsächlich das Wort ausdrückte, „cruise“ da, es funktioniert ... was seltsam ist. Siehe unten,

title = snapshot.val().cruise; 

Answer 1

Sie versuchen die Eigenschaft zuzugreifen genannt grabIdentifier Sie Klammer-Notation verwenden müssen, den Eigenschaftsnamen für den Zugriff auf das grabIdentifier verweist

title = snapshot.val()[grabIdentifier] 

für weitere Informationen über Eigenschaftenaccessoren sehen https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors