我可以用商店支持 Sencha 触摸卡布局吗？

Posted 2023-02-25

【中文标题】我可以用商店支持 Sencha 触摸卡布局吗？

【英文标题】：Can I back a Sencha Touch Card Layout with a Store?

【发布时间】：2012-03-16 04:02:50

【问题描述】：

我有一个卡片布局的视图 (Panel)。我有一个Store，比如n 项目。我想创建一堆n 卡片，每张卡片都由Store 中的一个项目支持。如果不手动在for 循环中添加n 卡、遍历Store 中的项目，我该如何做到这一点？

【问题讨论】：

您不想只使用for 循环的任何特殊原因？

当我已经拥有包含我需要的一切的Store 时，我需要维护一个单独的列表。我希望能够过滤商店以便只有某些卡片在堆栈上。只使用Store 似乎更加优雅和惯用。

这需要一些工作。您将需要创建一个新的自定义组件来为您处理这一切。谢天谢地，ST 2.x 中的Ext.data.Store 组件有很棒的事件，所以只需要监听这些事件，并在必要时替换现有组件即可。不过会很难优化。

【参考方案1】：

您需要一个单独的列表来包含所有卡片，您不能将面板的卡片列表与商店连接（至少在当前版本的 Sencha Touch 中）。

你无法避免手动添加，但可以避免 for 循环：

Ext.regModel('someModel',  
    fields: [
        name: 'title', type: 'string' ,
        name: 'info', type: 'string' 
    ]
);

var someStore = new Ext.data.Store( 

    model: "someModel",
    listeners:
        add:function(store, list, index)
            //here list is list of records you added
            var item = list[0];
            panelinstance.insert(index, ...whatever component...panel,list,carousal whatever);
        
     
);

小心调用者：一次向您的商店添加一件商品（这可能听起来很荒谬），但我认为这是使您的面板“连接”到商店的唯一方法。