我正在尝试在当前使用 React Router 的 ReactJS 应用程序中加载 facebook 评论插件。
如果我将 facebook 初始化代码放在我页面的 componentDidMount() 方法中,它会在第一次加载。但是在转到另一个页面然后再次返回它之后,它根本不会加载插件。
我需要做些什么才能让它一直出现吗?
我想我需要删除 facebook init 并再次重新初始化。但这感觉不对。
有什么建议吗?下面是我的组件代码
```
import React, { Component } from 'react';
import SlidingPanels from '../components/SlidingPanels';
export class Feedback extends Component {
constructor() {
super();
}
componentDidMount() {
$(window).scrollTo(0, '0.5s');
window.fbAsyncInit = function() {
FB.init({
appId : '115517331888071',
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse social plugins on this page
version : 'v2.5' // use version 2.1
});
}.bind(this);
// Load the SDK asynchronously
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
}
render() {
return (
<div>
<div className="fb-comments" data-href="https://www.facebook.com/cna.net.au/" data-numposts="10"></div>
</div>
);
}
}
``
谢谢, 约翰。
最佳答案
您只需要初始化 JavaScript SDK 一次,因为 componentDidMount
只会在它所在的位置被调用一次。尝试输入 FB.XFBML.parse()
在 componentDidUpdate
中:
componentDidUpdate() {
FB.XFBML.parse();
}
我不确定这是否是最佳解决方案,但它应该可行。
关于facebook - 在 ReactJS 应用程序中实现 Facebook 评论插件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34653455/