Question

我注意到Sencha Touch中有一个非常烦人的错误。当我尝试将分页插件添加到我的数据视图时，“加载更多”文本被放置在项目上方，而不是像我想要的那样。它适用于标准列表视图。

我发现另一个帖子要求我在我的数据视图中添加“inifinte：true”，但这没有帮助。也没有“底部：0”或“停靠：'底部'”选项。这是我的代码：

{
  xtype: 'dataview',
  plugins: {
     type: 'listpaging',
     loadMoreText: 'Indlæs flere..',
     autoPaging: true
  },
  flex: 1,
  cls: 'inspectionImages',
  itemId: 'imageContainer',
  padding: 10,
  style: 'background: #F7F7F7; color: black',
  emptyText: 'Der er ingen billeder på synet.',
  itemTpl: ['...'],
  loadingText: 'Henter billeder..',
  store: 'Images'
}

这里还有一个示例的sencha小提琴代码 - 框架是2.4.x：

Ext.application({
launch: function () {
    var touchTeam = Ext.create('Ext.DataView', {
        fullscreen: true,
        plugins: {
            type: 'listpaging',
            loadMoreText: 'Indlæs flere..',
            autoPaging: true
        },
        store: {
            fields: ['name', 'age'],
            data: [{
                name: 'Jamie',
                age: 100
            }, {
                name: 'Rob',
                age: 21
            }, {
                name: 'Tommy',
                age: 24
            }, {
                name: 'Jacky',
                age: 24
            }, {
                name: 'Ed',
                age: 26
            }]
        },
        itemTpl: '<div>{name} is {age} years old</div>'
    });

    touchTeam.getStore().add({
        name: 'Abe Elias',
        age: 33
    });

    touchTeam.getStore().getAt(0).set('age', 42);
  } // launch
}); // application()

我已经使用sencha touch文档中的Ext.dataview.dataview进行了检查，这在添加分页插件时显示了类似的行为，所以我知道这可能不是我自己的错。我真的希望将loadinText放在dataview的底部。任何建议都将受到高度赞赏！

Answer 1

列表分页插件是为列表开发的。如果您将其用于DataView，则“加载更多文本”将显示在“顶部”。我遇到了同样的问题。我已经通过List分页插件Js。然后通过更改Css属性获得解决方案..

检查＆＃34; loading-spinner＆＃34; CLass并将Style更改为：style =＆＃34; font-size：180％;保证金：10px auto; position：absolute;底部：0px;左：50％并检查班级 - ＆＃34; list-paging-msg＆＃34;并将样式更改为style =＆＃34; position：absolute;底部：0px;左：50％;＆＃34;

Answer 2

这是Sencha Touch中的一个错误。 Mitchell Simoens告诉here它只适用于List，但我相信这也应该支持dataview，因为它与list相比较轻。

在sencha论坛solutions中，您可以看到他们已将xtype从dataview更改为list。我也有同样的问题，我做了同样的事情。但是如果你想要dataview而不是list的外观，你可以做一些补充。

disableSelection: true,
pressedCls: '',

我希望这会对你有所帮助。如果您还有其他需要，请告诉我。

Answer 3

我在浏览了List paging Plugin，Ext.dataview.DataView和Ext.dataview.List的代码之后找到了解决方案。

初始化数据视图后初始化列表分页插件，然后加载更多组件＆＃34;位置是对的。

＆＃13;

{{1}}

＆＃13;

Answer 4

事实证明，分页符不适用于Dataview。它可以使用。最后我最终只是手动移动＆＃34;加载更多＆＃34;每个插件加载结束时DOM中的文本。为了确保没有丢失监听器，我使用了appendchild JS函数并应用了一些自定义css。现在一切都按预期工作。

使用分页插件的Sencha Touch数据视图

4 个答案: