javascript - 如何将媒体查询添加到 react 选择中的样式属性？

Question

我想添加一个媒体查询以使控制对象的宽度在 768px 及以上宽度上更改，但我无法将 JavaScript 添加到样式下的控制功能。

const mediaquery = "@media (min-width: 768px)"

<Select
  styles={{
    control: (base: CSSProperties, state: ControlProps<{}>) => ({
      ...base,
      width: "200px",
      // below code throws an error
      mediaquery: { width: "400px" }
  }}
/>

Answer 1

根据react-select文档，您可以为元素提供一个className属性。这是引用:https://react-select.com/styles#using-classnames

您可以创建一个 .css 文件并在其中定义所有媒体查询。然后在您的react-select组件中导入.css文件，例如import './style.css';。