花了几个小时，我最终得到了确切的30px高度的React选择与边界1px：

const customStyles = {
    control: (provided, state) => ({
      ...provided,
      background: '#fff',
      borderColor: '#9e9e9e',
      minHeight: '30px',
      height: '30px',
      boxShadow: state.isFocused ? null : null,
    }),

    valueContainer: (provided, state) => ({
      ...provided,
      height: '30px',
      padding: '0 6px'
    }),

    input: (provided, state) => ({
      ...provided,
      margin: '0px',
    }),
    indicatorSeparator: state => ({
      display: 'none',
    }),
    indicatorsContainer: (provided, state) => ({
      ...provided,
      height: '30px',
    }),
  };

您可以将样式添加到选择组件的任何部分，请查看相关文档
这是你要东西
在本例中，需要添加的代码如下所示：

const customStyles = {
  control: base => ({
    ...base,
    height: 35,
    minHeight: 35
  })
};

在选择组件中：

<Select
          className="basic-single"
          classNamePrefix="select"
          defaultValue={colourOptions[0]}
          isDisabled={isDisabled}
          isLoading={isLoading}
          isClearable={isClearable}
          isRtl={isRtl}
          isSearchable={isSearchable}
          name="color"
          options={colourOptions}
          styles={customStyles}
 />

您无法使其小于36 px的原因是dropdownIndicator和indicatorContainer（显示透明图标）在所有边都占用20 px（图标）+8px的填充。如果您减少填充，minHeight实际上将工作。

dropdownIndicator: (styles) => ({
    ...styles,
    paddingTop: 7,
    paddingBottom: 7,
}),
clearIndicator: (styles) => ({
    ...styles,
    paddingTop: 7,
    paddingBottom: 7,
}),

你可以玩周围的填充dropdownIndicator和clearIndicator。
我注意到你不能在minHeight中低于30 px，因为valueContainer，除非你改变它的高度/填充。

使用theme属性，我几乎无法将Select组件缩小到32px（* 在我的浏览器中 *）。当高度大于45px时，效果很好。您也可以省略baseUnit属性。

它不适用于小号

第一个

CSS方式

您可以指定classNamePrefix并使用它来覆写CSS样式。
第一个

我能够重写菜单列表的css风格：

/* over write css in react-select module */
    .Select__menu-list {
      max-height: 120px !important;
    }

如果您只想调整框的大小，请使用此选项。

.create-select {
    width: 160px;
    float: right;
    color: #000;
    [class$="ValueContainer"] {
        min-height: 28px !important;
        max-height: 28px;
    }
    [class$="IndicatorsContainer"] {
        min-height: 28px !important;
        max-height: 28px;
    }
    [class$="-Input"] {
        min-height: 28px !important;
        max-height: 28px;
        padding: 0px;
    }
    [class$="-control"] {
        min-height: 28px !important;
        max-height: 28px;

    }
}

"原因"
.control具有已定义的38px的min-height。

修复

将.control上的min-height更改为您所需的高度。

const customStyles = {
  control: (provided, state) => ({
    ...provided,
    minHeight: '30px',
    ...additionalStyles
  }),
};

在我的例子中，我必须为类__value-container设置css height属性
代码如下：

.react-select__value-container {
    height: 3rem;
}