如何将搜索栏添加到嵌套列表？答案

【问题标题】：How to add a Search Bar to a Nested List?如何将搜索栏添加到嵌套列表？
【发布时间】：2012-05-14 15:39:19
【问题描述】：

如何创建带有搜索栏的嵌套列表，它应该是位于标题下方。例如，在第四个煎茶嵌套列表示例，我将如何插入搜索栏（下面的代码）以便它看起来像这样的图像：

示例搜索栏：

Ext.define('Sencha.view.SearchBar', { 扩展：'Ext.Toolbar'， xtype : '搜索栏', 要求：['Ext.field.Text', 'Ext.field.Search'], 配置：{ ui: '搜索栏', 布局：'vbox'，项目： [ { xtype：'标题'，标题：“搜索” }, { xtype: '搜索域', placeHolder: '搜索...' } ] } });

【问题讨论】：

标签： sencha-touch-2

【解决方案1】：

您需要在嵌套列表实例化后添加它，因此停靠位置正确。

var nestedList = Ext.create('Ext.NestedList', {
    ...
});

nestedList.add({
    docked: 'top',
    xtype: 'searchbar',
    height: 100
});

【讨论】：

我将 xtype 更改为用户定义的“搜索栏”，并将其粘贴到我引用的页面上的最后一个 Sencha“实时预览”示例中，但它不起作用。
您需要添加对nestedList 的引用。您还需要给搜索栏一个固定的高度，因为它是一个 vbox（twitter 示例在 CSS 中添加了它的高度）。图片：rwd.me/Fzlo 来源（您可以将其粘贴到实时预览中）：rwd.me/FzlK
这似乎做到了。你的源代码会留在那里吗？您是否应该使用 xtype: 'searchbar', height: 100 更新答案并删除标题？
是的，但我已经更新了答案以反映搜索栏。谢谢。