Reactjs 如何使Reaction Select 选项菜单从选项数组的特定索引开始

默认情况下， Select 中间选项并使用custom option component. Select 选项后，请拨打scrollIntoView({ behavior: "instant", block: "center" }).

const hours = [
    {
        label: '04:45',
        value: '04:45'
    },
    {
        label: '05:00',
        value: '05:00'
    },
    {
        label: '05:15',
        value: '05:15'
    },
    {
        label: '05:30',
        value: '05:30'
    },
    {
        label: '05:45',
        value: '05:45'
    },
    {
        label: '06:00',
        value: '06:00'
    },
    {
        label: '06:15',
        value: '06:15'
    },
    {
        label: '06:30',
        value: '06:30'
    },
    {
        label: '06:45',
        value: '06:45'
    },
    {
        label: '07:00',
        value: '07:00'
    },
    {
        label: '07:15',
        value: '07:15'
    },
    {
        label: '07:30',
        value: '07:30'
    },
    {
        label: '07:45',
        value: '07:45'
    }
];

const Option = (props) => {
    const ref = useRef();

    useEffect(() => {
        props.isSelected && ref.current.scrollIntoView({ behavior: "instant", block: "center" });
    }, [props.isSelected]);

    return !props.isDisabled ? (
        <components.Option {...props} innerRef={ref} />) : null;
};

export default function () {
    const components = {
        Option: Option,
    }
    return (
        <Select
            components={components}
            isRtl
            defaultValue={hours[Math.floor(hours.length/2)]}
            options={hours}
            isSearchable={false}
        />
    )
}