ExtJs4动态加载工具栏中的项目

ExtJs4 dynamically load items in a toolbar

本文关键字:项目 工具栏 动态 加载 ExtJs4      更新时间:2023-09-26

如何在ExtJs 4工具栏中动态加载项目?我想从JSON中加载项目

我试过这个加载器,但是它就是让人头疼。

Ext.define('Backend.view.Nav' ,{
    alias: 'widget.Nav',
    extend: 'Ext.toolbar.Toolbar',
    initComponent: function() {
        this.items = [
        {
            iconCls: 'freewinder',
            text: 'Freewinder'
        },
        {
            iconCls: 'application',
            text: 'Applikationen',
            xtype: 'splitbutton'
        },
        {
            iconCls: 'component',
            text: 'Komponenten',
            xtype: 'splitbutton'
        },
        '-',
        {
            emptyText: 'Suche ...',
            xtype: 'textfield'
        }];     
        this.callParent(arguments);
    }
});

您可以使用Ext.toolbar.Toolbaradd方法在工具栏构建完成后动态添加项目:http://docs.sencha.com/ext-js/4-0/#!/api/Ext.toolbar.Toolbar-method-add

你希望它如何工作?工具栏应该出现,发出一个AJAX请求,然后添加菜单项——或者服务器应该在页面加载时给客户端应用程序一些包含菜单项的JSON,或者您希望它如何准确地工作?

如果服务器在页面加载时输出JSON,您可以执行this.items = jsonItems