提前禁用React Bootstrap异步输入中的一项或多项选定项
利尼杜·普拉内斯·冈纳西拉卡
我正在使用react-bootstrap-typeahead将项目添加到列表中。我想根据条件禁用添加项的删除按钮。
https://ericgio.github.io/react-bootstrap-typeahead/
埃里乔
是的，您可以使用renderToken道具自定义令牌的呈现方式。
令牌本身接受disabled道具。如果为true，则令牌将为只读且外观已禁用。
或者，省略onRemove令牌上的道具将使其变为只读，而不会禁用外观。
这是有关如何指定上述每种方法的基本示例：
<Typeahead
...
multiple
renderToken={(option, props, idx) => (
<Token
disabled={idx === 0}
onRemove={idx === 1 ? undefined : props.onRemove}>
{option.label}
</Token>
)}
/>
工作沙箱：https : //codesandbox.io/s/react-bootstrap-typeahead-token-customization-495-54gtg
注意：在禁用和只读情况下，添加后用户将无法删除选择，因此请注意用户体验。disabled当禁用整个预输入时，通常最好使用此状态。在这种情况下，disabled状态会自动传递到令牌组件。例如，当您要预选必需的选项时，只读选项是不错的选择。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
禁用链接中的最后一项
- 2
如何使用Bootstrap仅在导航栏中的一项中禁用导航丸悬停效果？
- 3
javafx如何禁用checkboxTreeItem中的一项？
- 4
React仅渲染从Firebase下载的列表中的一项
- 5
React组件仅在我的对象中呈现一项
- 6
在React / Javascript中动态禁用的多个输入项
- 7
使用React从JSON获取一项
- 8
Javascript暂停-禁用一项功能，直到另一项完成
- 9
当ObservableArray在Knockout中只有一项时如何禁用按钮
- 10
当ObservableArray在Knockout中只有一项时如何禁用按钮
- 11
一项输入特征的多项式回归
- 12
MVC4禁用一项操作的验证
- 13
禁用一项UITabbar项目的旋转
- 14
如何禁用JComboBox上的第一项
- 15
Javascript / React-获取匹配特定条件的数组中的第一项
- 16
React Hooks-在map（）函数中仅将className设置为一项
- 17
React Native：更新状态中的一项时，我是否需要`...this.state`
- 18
Android中的一项服务多项活动
- 19
Android中的一项服务多项活动
- 20
当用户特别选择一项时，JQUERY 禁用复选框项
- 21
在上一个选择框中更改同一项目时禁用项目
- 22
使Bootstrap Nav中的一项居中
- 23
禁用了Angular中针对同一项目的其他Select Option字段选择的项目
- 24
是否可以在MVC 5控制器中的一项操作上禁用身份验证筛选器？
- 25
禁用了Angular中针对同一项目的其他Select Option字段选择的项目
- 26
Android片段-一项或多项活动？
- 27
为什么在react应用程序中仅更改地图功能中的最后一项？
- 28
Android Apps的一项活动中的多个异步任务
- 29
将关系数据库中的一项与另一项或多项联系起来
我来说两句