將Twitter小部件添加到extjs面板中

Question

我是ExtJ的新手。 我在twitter上創建了一個twitter小部件。 它只在簡單的html頁面上正常工作。 正如Twitter所說，您只需要包括

<a class="twitter-timeline" href="https://twitter.com/search?q=%23certain" data-widget-id="widget-id">Tweets about "#certain"</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

將其放入html會在UI上創建一個漂亮的小部件，但我希望將其包含在extjs面板中。 它僅創建超鏈接，而不創建窗口小部件。 誰能幫我。

Answer 1

如果有人在尋找答案，這就是我的解決方法，

var tweetHtml = '<a class="twitter-timeline" href="https://twitter.com/search" data-widget-id="your-widget-id" height="' + height + '" >Tweets for Certain Mobile</a>';
var dialog = new Ext.Panel({
    xtype: 'panel',
    height: '100%',
    border: false,
    scroll: 'vertical',
    listeners: {
        single: true, // Remove the listener after first invocation
        afterrender: function() {
            ! function(d, s, id) {
                var js, fjs = d.getElementsByTagName(s)[0],
                    p = /^http:/.test(d.location) ? 'http' : 'https';
                if (!d.getElementById(id)) {
                    js = d.createElement(s);
                    js.id = id;
                    js.src = p + "://platform.twitter.com/widgets.js";
                    fjs.parentNode.insertBefore(js, fjs);
                }
            }(document, "script", "twitter-wjs");
        }
    },
    html: tweetHtml
});

Answer 2

在傳遞給Ext.Panel的構造函數的config對象中，只需為html屬性添加一行即可。 該屬性的值只是定義您的Twitter小部件的HTML字符串。

Answer 3

將javascript部分移至面板的afterrender偵聽器中：

Ext.widget('panel', {
    renderTo: Ext.getBody()
    ,title: "Tweeter!"
    ,width: 500
    ,height: 300
    ,html: '<a class="twitter-timeline" href="https://twitter.com/search?q=%23certain" data-widget-id="widget-id">Tweets about "#certain"</a>'
    ,listeners: {
        afterrender: function() {
            !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
        }
    }
});