Question

我现在已经做了很多天了，但是我有限的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);


                        }
                  });
            })

现在，这为旋转木马添加了适当数量的项目。它们显示，但没有我指定的内容：

这是Carousel本身：

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）时，这些项在carousel对象中显示为innerItems。

非常感谢任何帮助!!

Answer 1

嗯，我自己修理了，或者更好，我发现了一个似乎是我想要的解决方法。

我最终放弃了构造函数。

相反，我覆盖了'speakerName'键值对的apply方法。

从那里，我可以使用：

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

设置项目内的内容。

如果有人知道“真实”的方式，我仍然会非常感谢输入！

动态轮播内容未显示

1 个答案: