Question

我一直有一段时间让评论计数脚本在我的反应页面上工作。首先，他们建议将脚本放在<body>标记底部的index.html文件中。我做到了这一点，看不到任何结果。

＆＃13;

  <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>

＆＃13;

我有一个index.js文件，它正在加载我的所有组件，包括组件（让我们称之为ResultComponent.js），我想让评论数为<span>个标签。{ {1}}标记本身如下所示：

＆＃13;

<span>

＆＃13;

到目前为止，这么简单。我没有使用任何

var commentCount = <span className="disqus-comment-count" onClick={function() {this.setState({currentSelectedTab: 4})}.bind(this)} 
			data-disqus-identifier={idGoesHere}
			style={{fontVariant:"small-caps"}}>0 Comments</span>

代码，因此我无法在任何地方获得<a>。当我加载我的页面时，我希望我的评论数量会上升，但没有这样的运气。为了测试这一点，我从原始count.js脚本（located here）复制了未加改变的原始脚本。然后我将它直接粘贴到Chrome的devtools控制台上，它起作用了;所有相关的评论计数器都达到了适当的值。

编辑：一天后，更多的刺激;我在disqus.com域的实际代码中添加了断点。脚本标记中的脚本在正确的时间运行得很好，除了它在进入displayCount（）函数时缺少变量。有几个变量只是没有给定值，所以它不能进入并填充注释计数，它总是失败。当我从index.html中调用它时，我不知道为什么会失败，但是当我将原始count.js代码粘贴到我的控制台并在那里执行时，我不知道。不知道为什么。

澄清一下，这是相关的代码：

＆＃13;

#disqus_thread

＆＃13;

＆＃13; 当它正常运行时，从我将脚本粘贴到控制台中，就会定义

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
            }
    }
    ;

变量。当它从index.html调用时，j未定义，因此在第一个j失败。在两种情况下，调用URL都完全相同：if。这给出了

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

参数，当我在本地运行脚本时，它定义了b，以便if中的赋值运算符可以工作（这是一种非常奇怪的方式，但是没问题。）< p>

再次修改：我应该指出我在本地测试服务器（j）上执行此操作，不确定这是否有所作为？

修改更多内容：我上述问题的答案结果是“不”。我将我的代码上传到我的服务器，生产网站也显示该脚本没有正常运行。这是荒谬的......我现在已经没有想法了。

再次编辑：部分突破......我将此代码添加到ResultComponent.js：

＆＃13;

localhost:3000

＆＃13;

好消息;当我刷新页面时，它显示正确的评论计数！万岁！坏消息：当我更改隐藏结果组件的页面部分，然后将其恢复（触发

    componentDidMount() {
    	DISQUSWIDGETS.getCount();
    },

    componentDidUpdate() {
    	DISQUSWIDGETS.getCount();
    },

）时，componentDidUpdate调用无法正常工作。它仍然被调用，但脚本的DISQUSWIDGETS.getCount()部分永远不会被调用，因此DOM永远不会使用新信息进行更新。尽管以完全相同的方式调用，但这个可怕脚本的另一个例子却表现得不同......

Answer 1

好吧，在与Disqus的支持人员来回多次来回后，我终于找到了答案;我很接近。解决方案是：

    componentDidMount() {
    	DISQUSWIDGETS.getCount({reset:true});
    },

    componentDidUpdate() {
    	DISQUSWIDGETS.getCount({reset:true});
    },

原来我必须传递reset:true param，这使得getCount中的一大块代码能够实际执行某些操作。我想我可以从代码中找出这一点，但我责怪强烈缩小的格式（即使使用chrome dev工具帮助美化它）也让我错过了。关于如何添加评论计数器也在他们的知识库文章中，但我错过了它的背景（并且被'事实'吸收了'显然必须是脚本不工作，显然'。

因此结束了我最令人沮丧的几天编码之一。这是一个有用的教训......退后一步，不时地看一下大局，因为答案可以盯着你。

Disqus的count.js脚本无法在index.html中使用react.js网站

1 个答案: