材料UI搜索框与自动完成功能混合在一起

Question

我有一个AppBar组件（由Material UI提供），我希望我的Searchbox字段能够像在其中一样起作用：

https://material-ui.com/。

如您所见，它是Searchbox和Autocomplete的混合体-按视图看起来就像Searchbox，但是在输入值后-它返回了一组可选选项（Autocomplete效果）。

材料UI文档提供以下组件 我想使用的搜索栏：

https://material-ui.com/components/app-bar/#app-bar-with-a-primary-search-field

对于自动完成功能：

https://material-ui.com/components/autocomplete/

与他们一样，你们会建议得到什么结果？

Answer 1

我选择了Material UI Customized Autocomplete和AppBar with search field 我将它们混合在一起，并为您codesandbox创建了一个小例子。

这里的主要思想是将 Popper 与您想要的任何元素连接。

希望我能帮助您。请随时提出更多问题：）