0
Здесь я пытаюсь добавить простую панель инструментов со встроенной кнопкой, а после этого - список некоторых элементов. Я хочу, чтобы этот список сортировался, как только я нажимаю кнопку сортировки.Sencha Touch: недействительный элемент определен
Ниже приведен код вид:
Ext.define('UtilApp.view.Main', {
extend: 'Ext.Container',
xtype: 'main',
\t \t
\t initialize: function(){
\t \t this.callParent(arguments);
\t \t var Arr = new Array("Banana", "Apple", "Orange", "Peach", "Guava", "Pine", "Dates"); \t \t
\t \t var sortButton = {
\t \t \t xtype: 'button',
\t \t \t text: 'sort',
\t \t \t handler: this.sorter(Arr)
\t \t };
\t \t \t \t
\t \t var toolbar = {
\t \t \t xtype: 'toolbar',
\t \t \t title: Ext.Date.DAY,
\t \t \t docked: 'top',
\t \t \t items : [sortButton]
\t \t };
\t \t
\t \t
\t \t var list = Ext.create('Ext.List', {
\t \t \t fullscreen: true,
\t \t \t itemTpl: '{title}',
\t \t \t data: [
\t \t \t {title: Arr[0]},
\t \t \t {title: Arr[1]},
\t \t \t {title: Arr[2]},
\t \t \t {title: Arr[3]},
\t \t \t {title: Arr[4]},
\t \t \t {title: Arr[5]},
\t \t \t {title: Arr[6]}
\t \t \t ]
\t \t });
\t \t
\t \t
\t \t console.log("List Created!");
\t \t
\t \t this.add([toolbar, list]);
\t },
\t
\t sorter: function(Arr, toolbar, list){
\t \t console.log("Starting sort");
\t \t var sortedArray = Ext.Array.sort(Arr);
\t \t console.log(sortedArray);
\t \t console.log("Sorted");
\t \t this.add([this.toolbar, this.list]);
\t \t console.log("added");
\t }
});extend: 'Ext.Container',
xtype: 'main',
initialize: function(){
this.callParent(arguments);
var Arr = new Array("Banana", "Apple", "Orange", "Peach", "Guava", "Pine", "Dates");
var sortButton = {
xtype: 'button',
text: 'sort',
handler: this.sorter(Arr)
};
var toolbar = {
xtype: 'toolbar',
title: Ext.Date.DAY,
docked: 'top',
items : [sortButton]
};
var list = Ext.create('Ext.List', {
fullscreen: true,
itemTpl: '{title}',
data: [
{title: Arr[0]},
{title: Arr[1]},
{title: Arr[2]},
{title: Arr[3]},
{title: Arr[4]},
{title: Arr[5]},
{title: Arr[6]}
]
});
console.log("List Created!");
this.add([toolbar, list]);
},
sorter: function(Arr, toolbar, list){
console.log("Starting sort");
var sortedArray = Ext.Array.sort(Arr);
console.log(sortedArray);
console.log("Sorted");
this.add([this.toolbar, this.list]);
console.log("added");
}
});
Я получаю ошибку следующим образом:
Uncaught Ошибка: [ERROR] [Ext.Container # добавить] Недопустимый элемент Дано: не определено, должно быть либо объект конфигурации на заводе новый элемент или экземпляр существующего компонента
Этот список не отображается на экране, если я удаляю этот обработчик. Я не мог понять, что означает ошибка, поскольку я новичок в сенчане, а также Ext.js. Пожалуйста помоги.