使用语义UI React,如何构建类似于Stack Overflow的标签输入?

学徒

我对构建诸如堆栈溢出之类的标签输入功能感兴趣,该功能集包括:

  1. 具有自动完成功能的输入字段(接受用户输入,从服务器获取结果并将这些结果显示给用户以便于选择。
  2. 输入字段包含1个或多个选定项目作为标签。
  3. 输入之外的建议,单击这些建议会将结果添加到输入字段中。

堆栈溢出的屏幕截图:

在此处输入图片说明 在此处输入图片说明

我正在使用Semantic-UI-React,并注意到有一个可以工作的搜索组件:https : //react.semantic-ui.com/modules/search

似乎该语义UI反应搜索组件不允许添加多个结果或通过输入之外的方法添加结果。我想念什么吗?

我应该为这个功能使用语义UI还是我需要在React应用程序中完全从头开始构建它?

丹·奥奇亚娜

在react语义UI下拉文档中没有正确突出显示,但是allowAdditions字段将启用标记功能:

<Dropdown search selection multiple allowAdditions />

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

无法使用语义ui-react减少reactjs中标签的fontSize

如何使用语义UI反应标签OnRemove处理程序/ removeIcon属性?

如何使用语义UI组件设置宽度和高度输入

使用语义UI React闪烁模式

如何使用语义UI CDN?

如何使用语义ui样式?

如何使用语义UI React从表中获取数据

如何在Webpack中使用语义UI

如何安装和使用语义UI反应

如何使用语义UI反应下拉菜单

如何在语义UI React中使用语义UI的主题?

用语义UI反应React Native

有没有人能够使用语义UI设置create react app?

使用语义 UI 时,h2 元素在 React 中不可见

React ES6:使用语义UI在下拉列表中获取选定的值

尝试使用语义UI React Dropdown时出现“ TypeError:Object(...)不是函数”错误

如何使用语义UI重新创建自动可折叠菜单以做出反应?

如何在Visual Studio ASP.NET Core项目中使用语义UI反应?

如何使用语义UI和Meteor提交实时验证的表单?

使用语义UI反应手风琴时如何扩展/折叠部分标题

如何使用语义UI创建子菜单可滚动下拉菜单?

如何使用语义UI API发出JSON内容类型的POST请求

如何使用语义UI打开多个手风琴作出反应?

如何在另一个中使用语义 ui 添加 div?

如何使用语义 ui 响应捕获图标值、更改值和颜色

如何使用语义 UI 在同一网格中创建“宽屏”和“计算机”类

SwiftUI:如何使用语义放置呈现多个 ToolbarItem?

使用语义UI React(Table,Stick,Visibility组件)的无限滚动表导致`<tr>不能显示为<div>`警告的子级

使用React.js和语义UI React渲染动态标签