我已按照教程在Sencha Touch中制作无限滚动页面（页面大小为25）。虽然分页工作完美，但我一直遇到滚动位置重置到顶部的问题。作为一种解决方法，我尝试手动保存滚动位置并再次设置它，但即使这样也没有达到预期的效果。
该页面的代码如下：
Ext.define('Rms.view.common.AssetListPanel', {
extend: 'Ext.Panel',
alias: 'widget.asset_list',
requires: [
'Rms.model.AssetModel',
'Ext.plugin.ListPaging',
'Ext.dataview.List',
'Ext.field.Search'
],
config: {
layout: 'fit',
store: null,
items: {}
},
initialize: function () {
Ext.Viewport.setMasked({
xtype: 'loadmask',
message: 'Fetching all assets...'
});
this.setItems(
{
xtype: 'list',
id: 'lis',
indexBar:false,
grouped: false,
store: this.config.store,
plugins: [{
autoPaging: true,
type: 'listpaging'
}
],
infinite: true,
onItemDisclosure: true,
variableHeights: true,
//scrollToTopOnRefresh: false,
items: [
{
xtype: 'toolbar',
docked: 'top',
items: [
{
xtype: 'searchfield',
id: 'assetListSearch',
docked: 'right',
width: 130,
placeHolder:'Search',
listeners: {
scope: this,
keyup: function (field) {
var value = field.getValue();
var assetStore = Ext.getStore('assetStore');
assetStore.clearFilter();
//sto.filter('name', value);
if (value) {
var thisRegEx = new RegExp(value, "i");
assetStore.filterBy(function (record) {
return (thisRegEx.test(record.get('name')))
});
}
var list = Ext.getCmp('lis');
if (list.scroller) {
list.scroller.scrollTo({x:0, y:0},true);
}
list.refresh();
},
clearicontap: function () {
var assetStore = Ext.getStore('assetStore');
assetStore.clearFilter();
}
}
},
{
xtype: 'button',
text: 'Near',
id: 'nearest_Asset'
},
{
xtype: 'button',
text: 'Group List'
}
]
},
{
xtype: 'toolbar',
docked: 'top',
layout: {
pack: 'center'
},
items: [
{
//Segmented Button for Sorting
xtype: 'segmentedbutton',
pack: 'center',
allowMultiple: false,
margin: '0 0 0 10',
items: [
{
text: 'A-Z',
handler: function () {
var list = Ext.getCmp('lis');
var store = Ext.getStore('assetStore');
//Resetting the grouper
list.getStore().setGrouper({
groupFn: function () {
return '';
}
});
list.setGrouped(false);
//Setting the grouper
store.setGrouper({
groupFn: function (record) {
return record.get('name')[0].toUpperCase();
}
});
list.setGrouped(true);
list.setIndexBar(true);
//list.setIndexBar( {
// letters: ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'].sort()
// });
}
},
{
text: 'Status',
handler: function () {
var list = Ext.getCmp('lis');
var store = Ext.getStore('assetStore');
//Resetting the Grouper
list.getStore().setGrouper({
groupFn: function () {
return '';
}
});
list.setGrouped(false);
//Setting the grouper
store.setGrouper({
groupFn: function (record) {
return record.get('assetStatus').toUpperCase();
}
});
list.setGrouped(true);
list.setIndexBar(false);
}
},
{
text: 'None',
pressed: true,
handler: function () {
var list = Ext.getCmp('lis');
var assetStore = Ext.getStore('assetStore');
list.getStore().setGrouper({
groupFn: function () {
return '';
}
});
list.setGrouped(false);
list.setIndexBar(false);
list.refresh();
}
}
]
},
{
xtype: 'spacer'
},
{
xtype: 'segmentedbutton',
pack: 'center',
allowMultiple: false,
margin: '0 10 0 0',
items: [
{
text: 'T ▼',
pressed: true,
handler: function () {
//Sort by Last Reported Time
var sorters3 = [{
property: 'lastReportTime',
direction: 'DESC',
sorterFn: function (o1, o2) {
var date1 = o1.data.lastReportTime.replace('T', ' ');
var first = new Date(date1.replace(/-/g, '/'));
var date2 = o2.data.lastReportTime.replace('T', ' ');
var second = new Date(date2.replace(/-/g, '/'));
var v1 = new Date(first);
var v2 = new Date(second);
return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
}
}];
var assetStore = Ext.getStore('assetStore');
assetStore.sort(sorters3);
}
},
{
text: 'T ▲',
handler: function () {
//Sort by Last Reported Time
var sorters4 = [{
property: 'lastReportTime',
direction: 'ASC',
sorterFn: function (o1, o2) {
var date1 = o1.data.lastReportTime.replace('T', ' ');
var first = new Date(date1.replace(/-/g, '/'));
var date2 = o2.data.lastReportTime.replace('T', ' ');
var second = new Date(date2.replace(/-/g, '/'));
var v1 = new Date(first);
var v2 = new Date(second);
return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
}
}];
var assetStore = Ext.getStore('assetStore');
assetStore.sort(sorters4);
}
}
]
}
]
},
{
xtype: 'toolbar',
docked: 'bottom',
minHeight: '1.8em',
title: '<div style="font-size: 0.7em">'+(Ext.getStore('assetStore')).getCount()+' Assets</div>'
// items:[
// {
// xtype: 'spacer'
// },
// {
// xtype: 'title',
// title: '<div style="font-size: 0.7em">'+(Ext.getStore('assetStore')).getCount()+' Assets</div>'
// }
// ]
}
],
itemTpl: Ext.create('Ext.XTemplate',
'<span class="iconlist ao-{domainObjectType}"><b>{name}</b><br><span>{[this.formatDateTime(values.lastReportTime)]}<br> <b>{[this.engineState(values.assetStatus, values.domainObjectType)]}</b></span></span>', {
formatDateTime: function (isodate) {
//Fixing for iOS
var tempDate = isodate.replace('T', ' ');
var date = new Date(tempDate.replace(/-/g, '/'));
date.setMinutes(date.getMinutes() + App.config.user.timeZoneOffset);
return Ext.Date.format(date, App.config.user.dateTimeFormat);
},
engineState: function (assetStatus, config) {
if (config == 'canbusfleetvehicle') {
if (assetStatus == 'normal') {
return "Engine ON"
} else if (assetStatus == 'idling') {
return 'Idle'
}
else {
return "Engine OFF"
}
} else {
if (assetStatus == 'normal' || assetStatus == 'idling') {
return "Operating"
} else {
return "Not Operating"
}
}
}
}
)
});
Ext.Viewport.setMasked(false);
}
});
商店如下：
Ext.define('Rms.store.AssetStore', {
extend : 'Ext.data.Store',
requires: ['Rms.model.AssetModel'],
config : {
model : 'Rms.model.AssetModel',
storeId : 'assetStore',
pageSize : 25,
buffered : true,
clearOnPageLoad: false,
remoteSort : true,
params : {
domainDataView: 'allAssets',
sortValue : 'lastReportTime',
sortOrder : 1,
filters : JSON.stringify([])
},
grouper: {
groupFn: function (item) {
return;
} // groupFn
}, // grouper
sorters: [{
}],
proxy : {
type : 'ajax',
crossDomain: true,
url : App.config.serviceUrl + 'caesarObject/objectDataProvider3',
reader : {
type : 'json',
rootProperty : 'ui.items',
totalProperty: 'originalSize'
},
extraParams: {
domainObjectValues: JSON.stringify([
'name',
'lastReportTime',
'assetStatus',
'location',
'internalNumber',
'group',
'driver',
'alarmStatusForAsset',
'lastReportType',
'configuration',
'active'
])
},
limitParam : 'take',
pageParam : 'page',
startParam : 'skip'
}
}
});
控制台显示以下问题：
Container.js?_dc=1427538981315:494 Uncaught TypeError: Cannot read property