Question

我在facebook上获得了“分享”按钮的代码以及说明：

在您的网页上包含一次JavaScript SDK，最好是在开始标记之后。

<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_GB/sdk.js#xfbml=1&version=v2.4";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

将插件的代码放在您希望插件显示在页面上的任何位置。

<div class="fb-share-button" data-href="http://recovery.twindb.com" data-layout="button_count"></div>

所以我试图将它添加到ExtJS网络应用程序中。

我有一个视图，我在其中添加了fb-root容器和fbxxx我要放置按钮的位置：

Ext.define('recovery.view.Main', {
extend: 'Ext.container.Container',
...
items: [{
    xtype: 'container',
    id: 'fb-root',
    width: 50,
    height: 20,
    items: [{
        xtype: 'container',
        id: 'fbxxx'
    }]
}]
listeners: {
    beforerender: function (container) {
        (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_GB/sdk.js#xfbml=1&version=v2.4";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));

        var html = '<div class="fb-share-button" data-href="http://recovery.twindb.com" data-layout="button_count"></div>';
        var ctn = container.down('#fbxxx');
        console.log(ctn);
        ctn.update(html);
    }

然而，这不起作用。控制台中没有错误，但没有显示任何按钮。我做错了什么？

Answer 1

您可以在html文件中添加JavaScript SDK。

（您也可以使用Ext.mixin.Mashup加载JavaScript SDK）

一个工作示例：

https://fiddle.sencha.com/#fiddle/ule

Answer 2

您不需要SDK来放置共享按钮。以下是：

转到FB Share Button
填写分享按钮配置器的格式，然后点击＆＃34;获取代码＆＃34;
在已打开的窗口顶部，点击 IFrame
复制该代码并将其粘贴到＆＃34; html：＆＃34;应用内任何位置的属性。例如：

{ width: 64, height: 18, margin: '0 11 0 0', html: 'here goes the IFrame code' }

如何在ExtJS中添加Facebook共享按钮

2 个答案: