React Select：如何强制显示下拉列表以便处理样式？

Question

我需要处理 React Select 下拉选项的样式。我通常进行 CSS 样式工作的方法是使用 Chrome 中的开发工具，指向页面上的一个元素，然后开始在Styles选项卡中调整 CSS 属性，然后查看元素如何变化。

React Select 下拉选项样式的问题在于，这些选项仅在元素具有焦点时才可见。当我打开开发者工具时，元素失去焦点并且下拉菜单消失！

有没有办法让我在元素没有焦点的情况下强制 React Select 显示下拉选项？

Answer 1

安装 React Developer Tools，以便可以强制 Select 组件的

isOpen

状态为

true

。然后，当您使用 Chrome 的开发人员工具时，下拉菜单将保持打开状态。

来源

Answer 2

对于 Google Chrome，您可以“模拟聚焦页面”，这样即使单击其他地方，页面也能保持聚焦。

该选项位于 渲染选项卡中。