Ich habe eine Menge Zeit damit verbracht, das Kommentar-Count-Skript auf meinen reagierenden Seiten funktionieren zu lassen. Um zu beginnen, empfehlen sie, das Skript in meine index.html Datei am Ende des Tags <body> zu setzen. Ich habe das getan und kein Ergebnis gesehen.Disqus's count.js Skript läuft nicht richtig in index.html mit react.js website
<body>
<div id="app">
</div>
<script src="static/index.js"></script>
<script id="dsq-count-scr" src="//mtg-hunter.disqus.com/count.js" async></script>
</body>ich eine index.js-Datei, die alle meine Komponenten geladen wird, einschließlich der Komponente (wir es ResultComponent.js nennen), die ich die Anzahl der Kommentare <span> Tags in haben wollen. die <span> Tags selbst wie folgt aussehen:
var commentCount = <span className="disqus-comment-count" onClick={function() {this.setState({currentSelectedTab: 4})}.bind(this)}
\t \t \t data-disqus-identifier={idGoesHere}
\t \t \t style={{fontVariant:"small-caps"}}>0 Comments</span>So weit, so einfach. Ich verwende keine <a> Tags, so dass ich nirgendwo #disqus_thread habe. Wenn ich meine Seite lade, erwarte ich, dass meine Anzahl an Kommentaren steigt, aber kein Glück. Um dies zu testen, kopierte ich das unbearbeitete Skript unverändert aus dem rohen Skript count.js (welches located here ist). Ich habe es dann direkt in die Devtools-Konsole von Chrome eingefügt, und es hat funktioniert. alle relevanten Kommentarzähler gingen zu ihren entsprechenden Werten.
EDIT: einen Tag später, mehr stupsen; Ich habe Haltepunkte im aktuellen Code in der Domain disqus.com hinzugefügt. Das Skript im Skript-Tag läuft zum richtigen Zeitpunkt einwandfrei, außer dass Variablen fehlen, wenn es die Funktion displayCount() aufruft. Es gibt mehrere Variablen, die nur keine Werte erhalten, so dass sie nicht kommen und die Kommentare zählen können, es kommt immer fehl. Ich habe keine Ahnung, warum das fehlschlägt, wenn es in meiner index.html aufgerufen wird, aber nicht, wenn ich den rohen count.js Code in meine Konsole einfüge und es dort mache. Keine Ahnung warum.
Um zu klären, ist dies der entsprechende Code:
e.displayCount = function(b) {
for (var c, a, d, e = b.counts, b = b.text.comments; c = e.shift();)
if (a = j[c.id]) {
switch (c.comments) {
case 0:
d = b.zero;
break;
case 1:
d = b.one;
break;
default:
d = b.multiple
}
c = d.replace("{num}", c.comments);
a = a.elements;
for (d = a.length - 1; d >= 0; d--)
a[d].innerHTML = c
}
}
;j Variable definiert ist. Wenn es von index.html aufgerufen wird,
j ist nicht definiert, so dass es bei der ersten
if fehlschlägt. Die aufrufende URL ist in beiden Situationen identisch:
http://mtg-hunter.disqus.com/count-data.js?1=19767&1=235597&1=373322&1=382310&1=382841&1=382866&1=383023&1=397543&1=397682&1=398434. Das gibt den
b Parameter, und wenn ich das Skript lokal ausführe, definiert es
j, so dass der Zuweisungsoperator im if funktionieren kann (was eine wirklich seltsame Art ist, es zu tun, aber ok).
noch einmal bearbeiten: Ich sollte darauf hinweisen, dass ich dies auf einem lokalen Testserver (localhost:3000) mache, nicht sicher, ob das einen Unterschied macht oder nicht?
bearbeiten Sie mehr: Die Antwort auf meine obige Frage stellt sich als "Nein" heraus. Ich habe meinen Code auf meinen Server hochgeladen, und auf der Produktions-Site wurde auch angezeigt, dass das Skript nicht ordnungsgemäß ausgeführt wurde. Das ist absurd ... Ich habe jetzt keine Ideen mehr.
erneut bearbeiten mehr: Teilweise Durchbruch ... Ich habe diesen Code zu ResultComponent hinzugefügt.js:
componentDidMount() {
\t DISQUSWIDGETS.getCount();
},
componentDidUpdate() {
\t DISQUSWIDGETS.getCount();
},gute Nachricht; Wenn ich die Seite aktualisiere, wird die Anzahl der richtigen Kommentare angezeigt! Hurra! Schlechte Nachrichten: Wenn ich Teile der Seite, die die Ergebniskomponente ausblenden, und dann wieder zurückbringen (Triggerung componentDidUpdate), funktioniert der Anruf DISQUSWIDGETS.getCount() nicht. Es wird immer noch aufgerufen, aber der displayCount Teil des Skripts tut dies nie, daher wird das DOM nie mit den neuen Informationen aktualisiert. Es ist noch ein weiteres Beispiel für dieses schreckliche Skript, das sich anders verhält, obwohl es genau so aufgerufen wird ...
Scheint, als ob reactjs etwas zu Ihrem erwarteten Kontext tun könnte. Können Sie 'displayCount' so anpassen, dass Sie' j' als zusätzliches Argument übergeben können? – Ouroborus
Nein, dies ist ein Skript, das von disqus geladen/erstellt wurde und es befindet sich unter mtg-hunter.disqus.com/count.js. – IronWaffleMan
Obwohl nicht die beste Lösung, sieht es so aus, als ob Sie den Code aktualisieren können. Nachdem 'count.js' geladen wurde, weisen Sie' DISQUSWIDGETS.displayCount' einer Funktion zu, die Ihrem Geschmack entspricht. Oder erstellen Sie sogar eine lokale Kopie von 'count.js' und modifizieren und verlinken Sie dazu. Zumindest könnte dies beim Debuggen helfen. – Ouroborus