ExtJs - 具有动态可关闭标签的文本字段

Posted 2023-02-26

【中文标题】ExtJs - 具有动态可关闭标签的文本字段

【英文标题】：ExtJs - Textfield with dynamic closeable labels

【发布时间】：2016-03-22 04:36:24

【问题描述】：

我正在使用 ExtJS 4，我需要实现类似于在文本字段中输入电子邮件地址时在 GMail 中获得的可关闭标签（参见下面的屏幕截图）。我一直在查看 ExtJS 库，我看到的最接近的是提供某种类型的带有自定义可关闭面板的布局或使用带有网格的 CellEditing，但我仍然没有看到使用文本字段的方法。

所以我的问题是，我是否走在正确的轨道上，还是我应该考虑其他更适合这份工作的组件？此外，如果有人可以指出或提供与我在屏幕截图中的内容更接近的代码示例，那也将非常有帮助。

【问题讨论】：

Ext 5 引入了 tag 字段，这正是你所描述的。您可以考虑升级，或者可能尝试向后移植该组件。

@EvanTrimboli 据我所知，标签字段不允许通过键入添加新标签，只能从现有标签中进行选择。

它确实允许你这样做，它扩展了组合框：docs.sencha.com/extjs/6.0/6.0.1-classic/#!/api/…, docs.sencha.com/extjs/6.0/6.0.1-classic/#!/api/…

【参考方案1】：

当您使用 ExtJS 4 时，您应该查看 BoxSelect。

您可能需要在这里和那里进行必要的自定义。但在高层次上，这是为 Ext-4 输入标签的相当不错的字段。

事实上，ExtJS5 中的 Tag 字段是受 BoxSelect 启发的。