0

我已经为此工作了好几天,但我有限的 JS 知识似乎伤害了我。

我正在我的 ST2 应用程序中创建一个动态 Ext.Carousel 组件,该组件基于 Store 文件的内容。

这一切都很好,但无论如何我都会展示代码,这样就没有什么可以想象的了:

 Ext.getStore('DeviceStore').load(
            function(i) {


                  Ext.each(i, function(i) {
                        if (i._data.name == 'Audio Ring') {

                            var carousel = Ext.ComponentManager.get('speakerCarousel');

                            var items = [];
                            Ext.each(i.raw.speakers, function(speaker) {

                                items.push({
                                    sci: Ext.create('SmartCore.view.SpeakerCarouselItem', {
                                        speakerId: speaker.speakerid,
                                        speakerName: speaker.speakername,
                                        speakerEnabled: speaker.speakerenabled
                                    })
                                });


                            });
                            carousel.setItems(items);


                        }
                  });
            })

现在,这会将适当数量的项目添加到轮播中。它们显示,但没有我指定的内容:

这是旋转木马本身:

Ext.define('SmartCore.view.SpeakerCarousel', {
    extend: 'Ext.Carousel',
    xtype: 'speakerCarousel',
    config: {
        id: 'speakerCarousel',
        layout: 'fit',
        listeners: {
            activeitemchange: function(carousel, item) {
                console.log(item);

            }
        }


    }
});

这是项目类,我想将商店中的数据填充到:

Ext.define("SmartCore.view.SpeakerCarouselItem", {
    extend: Ext.Panel,

    xtype: 'speakerCarouselItem',

    config: {

        title:'SpeakerCarouselItem',
        styleHtmlContent: true,
        layout: 'fit'




    },

    constructor : function(param) {


        this.callParent(param);
        this.add(
            {
            layout: 'panel',
            style: 'background-color: #759E60;',

            html: 'hello'

            }
        )

    }
});

同样,正确数量的项目显示在轮播 (11) 中,但内容不可见,背景颜色也未更改。当我在浏览器中检查 console.log(item) 时,项目在轮播对象内显示为 innerItems。

任何帮助是极大的赞赏!!

4

1 回答 1

0

好吧,我自己修复了它,或者更好的是,我找到了一个似乎是我想要的解决方法。

我最终放弃了构造函数。

相反,我覆盖了“speakerName”键值对的应用方法。

从那里,我可以使用:

this._items.items[0]._items.items[i].setWhatever(...)

设置项目内的内容。

如果有人知道这样做的“真实”方法,我仍然非常感谢您的输入!

于 2012-10-01T15:45:34.547 回答