Добавление фейсбука SDK в набор для запуска реакции

Где или как добавить FB SDK? Я хочу добавить кнопку "Поделиться" и плагин для страницы.

    <!-- fb stuff -->
    <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 = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.10&appId=${FB_APP_ID}";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
    <!-- /fb stuff -->

1 ответ

Разместите JavaScript SDK на своей странице один раз, в идеале сразу после открытия <body> тег

Источник: https://developers.facebook.com/docs/plugins/share-button/

В React вы также можете загрузить его в свои основные компоненты componentDidMount функция, например:

componentDidMount() {
    (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#xfbml=1version=v2.10&appId=${FB_APP_ID}";
          fjs.parentNode.insertBefore(js, fjs);
        }
    }(document, 'script', 'facebook-jssdk'));
}

fb-root div будет сгенерирован автоматически, если он не существует.

Вам может понадобиться использовать FB.XFBML.parse в componentDidUpdate убедитесь, что вы понимаете, почему: https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/

Конечно, вы можете использовать FB только после загрузки JS SDK. Вот пример для fbAsyncInit функция: http://www.devils-heaven.com/facebook-javascript-sdk-login/

Другие вопросы по тегам