Это периодически возникающая проблема. Иногда, когда я смахиваю вверх и вниз по меню моего react-select
, события прокрутки идут не в меню, а в элементы под ним. Вы можете едва видеть содержимое, перемещающееся в горизонтальной трещине под полем ввода и над открытым меню. Я видел это только на мобильных устройствах, особенно на моем iPhone 5.
https://codesandbox.io/s/stop-indoctrination-d8pis
https://github.com/dancancro/questions/blob/master/components/QuestionsReader/index.jsx#L507-L513
<div className="heading" ref={this.headerRef}>
<table style={{ width: 100 + '%' }} >
<tbody>
<tr style={{ width: 100 + '%' }} >
<td>
<SearchBox
groupedQuestions={groupedQuestions}
questions={questions}
ui={ui}
onChange={this.onSearchChange}
pathname={pathname}
/>
</td>
<td style={{ width: "36px" }}>
<SideMenu religion={religion} onReligionChange={this.convertTo} />
</td>
</tr>
</tbody>
</table>
</div>
<main>
<div className="questions-list" ref={this.listRef}>
<div className="top-video">
<iframe src="https://www.youtube.com/embed/lYnjlrXIT1c" tabIndex={-1} id="main-video"
frameBorder="0" allowFullScreen width={0} height={0} title="Tracie Harris Describes Christian Childhood Indoctrination"></iframe>
</div>
https://github.com/dancancro/questions/blob/master/components/SearchBox/index.jsx#L177-L192
<Select
inputValue={inputValue}
options={options}
placeholder="Search..."
isSearchable={true}
menuIsOpen={searchMenuIsOpen}
onInputChange={this.onInputChange}
onFocus={this.onFocus}
ref={this.searchRef}
onChange={this.onChange}
value={null}
formatGroupLabel={formatGroupLabel}
styles={styles || {}}
components={{ Option, Input }}
filterOption={filterOptions}
/>