Dies ist im Wesentlichen dieselbe Frage wie Google-Anmelde-Schaltfläche mit react
Ich habe eine Reaktionskomponente:
%Vor% Aber während die Anmeldung erfolgreich ausgeführt wird, wird die Funktion onSignIn nie aufgerufen. Tatsächlich gibt es keine der Optionen, die ich für das Rendern der benutzerdefinierten Signin-Schaltfläche angegeben habe (d. H. Die quadratische Form und das dunkle Thema), daher rate ich aufgrund der <div>
-Klasse eine Standardschaltfläche.
Ich lade gerade die Bibliothek synchron, weil gapi
sonst nicht im Bereich ist, wenn componentDidMount
ausgelöst wird.
Die andere Option, die ich sehe, wäre googles Empfehlung, <script src="https://apis.google.com/js/platform.js?onload=renderButton" async defer></script>
zu verwenden und mein Rendering in eine Funktion einzufügen. Aber dann muss entweder dieses Skript in die Komponente geladen werden, oder ich muss einen Weg finden, dass diese Funktion als Callback in index.html
übergeben wird, von denen keine wie eine gute Lösung aussieht.
Wie kann ich die benutzerdefinierte Login-Schaltfläche anstelle der Standard-Schaltfläche anzeigen lassen?
Dieser Hack macht den Trick für jetzt ...
In meinem index.html
trigger ich ein benutzerdefiniertes Ereignis beim Laden der Bibliothek:
und meine Reaktionskomponente sieht jetzt so aus:
%Vor% Beachten Sie, dass das gerenderte <div>
"my-signin2" als id
nicht als class
hat.
Tags und Links reactjs google-signin