使用 defaultSelected 和 selected 的 react-bootstrap-typeahead 问题

【问题标题】：react-bootstrap-typeahead problems using defaultSelected and selected使用 defaultSelected 和 selected 的 react-bootstrap-typeahead 问题
【发布时间】：2017-07-11 20:34:13
【问题描述】：

当我在 Typeahead 中使用选项 defaultSelected 或 selected 时，我似乎无法使用退格键来删除输入并更改列表。

似乎得到了某种下一个数组选择，而不是覆盖值。

在某些时候，它似乎会遍历选项中的所有值，然后实际上会开始覆盖输入值，并且组件从那时起就可以正常工作了。

任何想法将不胜感激。

【问题讨论】：

你能发布代码示例吗？
尽量按原样使用组件。最后我按下了清除按钮。我曾认为这可能是我的组件重新渲染并导致问题，但我取出了任何设置状态的 onInputChange 或 onBlur 更改。它仍然发生在我身上。

标签： reactjs react-bootstrap bootstrap-typeahead

【解决方案1】：

试试：

defaultSelected={props.options.slice(selectedIndex, selectedIndex + 1)}

您描述的行为部分是由于您使用slice 的方式，部分是由于该组件的错误。来自slicedocumentation：

如果 end 被省略，切片从序列的末尾（arr.length）提取。

因为您只提供起始索引，所以您的 defaultSelected 数组有多个项目。但是，单选组件不会自动截断选择的数量（这将在即将发布的版本中修复），因此按退格键会删除当前选择并显示下一个，依此类推，直到没有更多项目selected 数组。

【讨论】：