SyntaxError:函数语句需要ExtJs中的名称

SyntaxError: function statement requires a name in ExtJs

本文关键字：ExtJs 函数语句 SyntaxError 更新时间：2023-09-26

我喜欢从ExtJs中的JSon响应填充checkboxgroup。当单击"发送"按钮时，它将在控制台中显示响应。

Ext.define('myclass', {
extend: 'Ext.form.Panel',
initComponent: function(){
Ext.apply(this, {
renderTo: Ext.getBody(),
title: 'Message',
tbar: [{
    text: 'Send',
    handler: function(){
    console.log(this.getValues());
    },
    scope: this
}],
items: []
});
    this.callParent(arguments);
}
});
    var messagePanel = new myclass();
loadCheckboxes : function(){
Ext.Ajax.request({
    url: 'recipients.json',
    success: function(response){
        console.log(response);
    },
    scope: this
    });
}
this.loadCheckboxes();
onLoad : function(response){
var jsonResponse = Ext.decode(response.responseText);
    if (jsonResponse.success) {
    // success
    console.log(jsonResponse);
    }
}
    Ext.Ajax.request({
    url: 'recipients.json',
    success: onLoad(),
    scope: this
    });
var checkboxGroup = {
xtype: 'checkboxgroup',
columns: 2,
fieldLabel: 'Recipients',
name: 'recipients',
style: {
padding: '10px'
},
items: []
};
this.add(checkboxGroup);
var i, len = jsonResponse.recipients.length, recipient;
for (i = 0; i < len; i++) {
recipient = jsonResponse.recipients[i];
    checkboxGroup.items.push({
    xtype: 'checkbox',
    boxLabel: recipient.fullName,
    name: 'recipients',
    inputValue: recipient.userID,
    checked: recipient.selected
    });
}

这是该代码的Json代码。

{
"success": true,
"recipients": [{
"fullName": "Stuart Ashworth",
"userID": 1,
"selected": true
}, {
"fullName": "Andrew Duncan",
"userID": 2,
"selected": false
}
]
}

当我运行此代码时，在控制台中显示错误。SyntaxError:函数语句需要一个名称loadCheckboxes:function（）｛

请给我建议这个问题的解决方案。

您似乎正在尝试定义对象的键值：

loadCheckboxes : function(){
    // ...
}

但是，这些应该是声明的变量或函数：

var loadCheckboxes = function () {
    // ...
};
function loadCheckboxes() {
    // ...
}

由于它们不在对象文字{...}中，其中语法name: value将定义对象的键集为函数表达式，函数表达式可以是匿名的。

相反，它们是后面跟着函数声明的标签，不能是匿名的。

检查的工作原理

Ext.define('myclass', {
    extend: 'Ext.form.Panel',
    initComponent: function() {
        Ext.apply(this, {
            renderTo: Ext.getBody(),
            title: 'Message',
            tbar: [
                {
                    text: 'Send',
                    handler: function() {
                        console.log(this.getValues());
                    },
                    scope: this
                }
            ],
            items: [
                {
                    xtype: 'checkboxgroup',
                    columns: 2,
                    fieldLabel: 'Recipients',
                    name: 'recipients',
                    style: {
                        padding: '10px'
                    },
                    items: []
                }
            ]
        });
        this.callParent(arguments);
    },
    onLoad: function(response) {
        var jsonResponse = Ext.decode(response.responseText);
        if (jsonResponse.success) {
            // success
            console.log(jsonResponse);
            var i, len = jsonResponse.recipients.length, recipient;
            var checkboxGroup = this.down('checkboxgroup[name="recipients"]');
            for (i = 0; i < len; i++) {
                recipient = jsonResponse.recipients[i];
                checkboxGroup.add({
                    xtype: 'checkbox',
                    boxLabel: recipient.fullName,
                    name: 'recipients',
                    inputValue: recipient.userID,
                    checked: recipient.selected
                });
            }
        }
    }
});
var messagePanel = new myclass();
function loadCheckboxes() {
    Ext.Ajax.request({
        url: 'recipients.json',
        success: function(response){
            console.log(response);
        }
        // , scope: this <-- you don't need scope here, you are not in a class
    });
}
loadCheckboxes(); // <-- I assume this call and the next are for debugging pourposes
Ext.Ajax.request({
    url: 'recipients.json',
    success: messagePanel.onLoad,
    scope: messagePanel
});