在ReactJS应用程序中实现Facebook评论插件

我正在尝试将facebook评论插件加载到当前正在使用React路由器的ReactJS应用程序中

如果我将facebook init代码放入页面的componentDidMount（）方法中，它将第一次加载。但是，在转到另一个页面，然后再次返回到该页面后，它根本不会加载插件

我需要做些什么才能让它一直出现吗

我想我需要删除facebook初始化并重新初始化。但这感觉不对

有什么建议吗？下面是我的组件代码

```

import React，{Component}来自'React'；
从“../components/SlidingPanels”导入滑动面板；
导出类反馈扩展组件{
构造函数（）{
超级（）；
}
componentDidMount（）{
$（窗口）。滚动到（0，'0.5s'）；
window.fbAsyninit=函数（）{
FB.init({
appId:'11551733188071'，
cookie:true，//启用cookie以允许服务器访问会话
xfbml:true，//解析此页面上的社交插件
版本：“v2.5”//使用版本2.1
});
}.约束（本）；
//异步加载SDK
（功能（d、s、id）{
var js，fjs=d.getElementsByTagName[0]；
if（d.getElementById（id））返回；
js=d.createElement；js.id=id；
js.src=“//connect.facebook.net/en_US/sdk.js”；
fjs.parentNode.insertBefore（js，fjs）；
}（文档“脚本”、“facebook jssdk”）；
}
render（）{
返回(
);
}
}

``

谢谢，

---

John.

您只需要初始化JavaScript SDK一次，而且由于

componentDidMount

只在调用一次后，就可以在它所在的位置进行调用。尝试输入组件diddupdate：

componentDidUpdate() {
    FB.XFBML.parse();
}

---

我不确定这是否是最好的解决方案，但它应该会起作用。

您可以将

FB.XFBML.parse（）

放在

componentdiddupdate（）

中，但它只在组件更新为

componentdiddupdate（）

是一种更新生命周期方法时起作用。如果您导航到其他组件，然后返回到它，则此解决方案将不起作用。因为在本例中，

componentDidMount（）

再次调用，但没有调用componentdiddupdate。因此，最好将

FB.XFBML.parse（）

放在

componentDidMount（）的顶部

令人惊叹的。谢谢你的帮助。
componentDidUpdate() {
    FB.XFBML.parse();
}

componentDidMount() {
  if(window.FB){
    FB.XFBML.parse();
  }
// all other code is same
}