Question

如何在React中使用facebook关注和发送按钮。我在index.html上加载了Sdk脚本

<div className="fb-follow" data-href="https://www.facebook.com/XXXXXXXXX" data-layout="standard" data-colorscheme="dark" data-size="large" data-show-faces="true"></div>

和

<div id="fb-send" className="fb-send" data-href="https://www.facebook.com/XXXXXXXXX/"></div>

我的index.html是

<div id="fb-root"></div><script>(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 = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.12&appId=XXXX&autoLogAppEvents=1';
fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>

我确实检查了我的浏览器是否生成了html。显示为

<div class="fb-send fb_iframe_widget" data-href="https://www.facebook.com/XXXXX/" fb-xfbml-state="rendered" fb-iframe-plugin-query="app_id=XXXXX6&amp;container_width=1100&amp;href=XXXXX&amp;locale=en_US&amp;sdk=joey">

Answer 1

不推荐使用关注按钮，但我们看不到开发者的网站。 https://developers.facebook.com/search/?q=follow+graph+api

Answer 2

如果您想使用带有React的社交插件，您必须使用此功能 - 例如，在componentDidMount：https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/

请注意，如果重新渲染组件，则可能需要再次调用此方法。此外，您需要等到JS SDK加载肯定。看一下fbAsyncInit函数：https://developers.facebook.com/docs/javascript/quickstart

此主题也可能对您有所帮助：Integrating Facebook Web SDK with ReactJS Component State

facebook发送，不再按照反应js工作

2 个答案: