如何在react-select的下拉菜单上显示滚动条? [英] How to show scrollbar on dropdown menu for react-select?

问题描述

滚动条没有显示在下拉菜单上，以便在 chrome 导航器上进行反应选择，同时它适用于 safari，我该如何解决?有什么解决办法吗?因为我无法滚动到我的最后一个项目.提前致谢.我正在使用 react-select 版本 2.4.2.

Scrollbar is not showing on dropdown menu for react select on chrome navigator, meanwhile it works for safari ,how do i fix that please ? any solution for it ? because I cannot scroll to my last item. thanks in advance. I am using react-select version 2.4.2.

import Select from 'react-select';

 <Select
   name={this.props.name}
   isSearchable
   isClearable
   defaultMenuIsOpen={this.state.defaultMenuIsOpen}
   value={this.state.selectedOption}
   onChange={this.handleChange}
   options={this.state.data}
   placeholder={this.props.placeholder}
 />

推荐答案

export const customStyleForTestsList = {
    control: (base, {isFocused}) => ({
        ...base,
        height: '30px' 
    }),
    option: (styles, {data, isDisabled, isFocused, isSelected}) => {
        return {
            ...styles,
            overflowY: 'scroll'
        };
    }
};

这些是您作为 style={{styles: customStyleForTestsList}} 传递给 Select 的 styles.我知道必须在 option 部分做一些事情.什么，我还是一窍不通.如果您找到答案，请在此处发布.

These are the styles you pass as style={{styles: customStyleForTestsList}} to the Select. I know something has to be done in the option part. What, I still am clueless. If you found you answer, please post it here.

这篇关于如何在react-select的下拉菜单上显示滚动条?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！