Question

我们如何用Sencha ExtJS中的for-loop替换硬编码数据？
比如说，我已经定义了以下列表：

Ext.application({  

    launch: function() {

        Ext.create('Ext.List', {
            fullscreen: true,
            itemTpl: '{title}',
            data: [{
                title: 'Item 1'
            }, {
                title: 'Item 2'
            }, {
                title: 'Item 3'
            }, {
                title: 'Item 4'
            }]
        });      
    }
});

如何将数据替换为以下内容：

Ext.application({
    launch: function() {

       Ext.create('Ext.List', {
            fullscreen: true,
            itemTpl: '{title}',
            data: [
               for(int i=0;i<5;i++){
                  {title: 'Item '+i}, 
               }
              ]
        });

    }
});

Answer 1

这是非常基本的东西 - 我建议您在将时间投入到框架之前熟悉基本的语言结构。有几种方法可以做到这一点...

请参阅：MDN: A re-introduction to Javascript

最简单的方式 ，首先创建配置数据并将其分配给变量：

Ext.application({
    launch: function() {

        var listData = [];
        for(var i=0;i<5;i++) 
            listData.push({title: 'Item '+i});

        Ext.create('Ext.List', {
            // ...
            data: listData
        });
    }
});

...或者当您处于全球执行范围内并且不想用不必要的污染 window 对象时变量 - 或者只是一个OCD而不是＃34;单行＆＃34; - 你可以利用内联函数/闭包：

Ext.create('Ext.List', {
    // ...
    data: (function(){
        var data = [];
        for(var i=0;i<5;i++) 
            data.push({title: 'Item '+i});
        return data;
    })()
});

...或者有时我使用了以下内容，因为我认为它看起来更整洁（但这是主观的）：

Ext.create('Ext.List', {
    // ...
    data: Ext.Array.map(Array.apply(null, Array(5)), function(o,i){
        return {title: 'Item '+i};
    })
});

使用循环创建一个简单的Sencha组件

1 个答案: