Sencha touch 2 在面板中呈现列表

Sencha touch 2 在面板中呈现列表,sencha-touch-2,Sencha Touch 2,我有一个面板,在那里我呈现一个搜索表单。这很有效。 我的问题是在该搜索表单下呈现列表(因此在同一面板中) 这就是我到目前为止所做的: Ext.define("TCM.view.UserSearch", { extend: "Ext.form.Panel", requires: [ "Ext.form.FieldSet", "Ext.List" ], xtype: "usersearch", config:

我有一个面板,在那里我呈现一个搜索表单。这很有效。 我的问题是在该搜索表单下呈现列表(因此在同一面板中)

这就是我到目前为止所做的:

Ext.define("TCM.view.UserSearch", 
{
    extend: "Ext.form.Panel",

    requires: 
    [
        "Ext.form.FieldSet",
        "Ext.List"
    ],

    xtype: "usersearch",

    config: 
    {
        scrollable:'vertical'
    },

    initialize: function () 
    {
        this.callParent(arguments);

        var clubsStore = Ext.create('TCM.store.Clubs');
        clubsStore.load();

        var usersStore = Ext.create('TCM.store.Users');

        var searchButton = 
        {
            xtype: 'button',
            ui: 'action',
            text: 'Search',
            handler: this.onSearchButtonTap,
            scope: this
        };

        var topToolbar = 
        {
            xtype: 'toolbar',
            docked: 'top',
            title: 'Search',
            items: [
                { xtype: 'spacer' },
                searchButton
            ]
        };

        var userClub = 
        {
            xtype: 'selectfield',
            store: clubsStore,
            name: 'clubId',
            label: 'Club',
            displayField : 'name',
            valueField : 'id',
            required: true
        };

        var userList = 
        {
            xtype: 'list',
            store: usersStore,
            itemTpl: '{name}',
            title: 'Search results'
        };

        this.add([
            topToolbar,
            { 
                xtype: "fieldset",
                items: [userClub]
            }, 
            userList
        ]);
    },

    onSearchButtonTap: function () 
    {
        console.log("searchUserCommand");
        this.fireEvent("searchUserCommand", this);
    }
});

我看不到在字段集(searchform)下呈现的任何内容。有什么问题吗?

大多数情况下,当您看不到某个组件时,是因为您没有将a设置为容器或高度

在本例中,您希望容器中有两个组件。因此,我建议采取行动


希望这能有所帮助。

我在一个项目中实际使用了类似的东西尝试一下这个…把它放在字段集的items属性中

        {
            xtype: 'searchfield',
            clearIcon: true,
            placeHolder: 'Type Some text'
        },
        {
            xtype: 'list',
            hidden:true,  //Initially hidden populate as user types something
            height: '150px',
            pressedDelay: 1,
            loadingText: '',
            store: 'listStore',
            itemTpl: '{\'What you want to be displayed as per your model field\'}'
        }

在控制器中,为searchfield的keyup事件编写一个处理程序,用相关数据加载存储并切换列表的hidden属性。希望这个列表能和搜索结果一起出现(对我来说很有用,看起来很不错)。希望这有帮助……

我的手机和你的手机几乎一样(除了pressedDelay等),但它不起作用。我错过了什么PDid下面的答案对你有帮助吗?那么,如果你仍然被困,你可以接受其中的一个,或者提供更多的细节。