Target only scrolls when using two fingers

[limaneto]

Hi, the approach using querySelector works, but when I use the ref approach, the target scrolls starts only using two fingers. Thanks for the lib by the way.

` class App extends Component { render() { return ( <div className="App"> <Content /> ); } }

class Content extends Component { targetRef = React.createRef(); targetElement = null; componentDidMount() { this.targetElement = this.targetRef.current; } disableScroll = event => { event.preventDefault(); disableBodyScroll(this.targetElement); }; render() { return ( <div className="App-header"> <button className="Button" onClick={this.disableScroll}>Disable Body Scroll <List ref={this.targetRef} /> ) } }

class List extends Component { render() { return ( <div className="Square" style={{ WebkitOverflowScrolling: 'touch' }}> <div className="Line" style={{ backgroundColor: 'yellow' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" > <div className="Line" style={{ backgroundColor: 'grey' }}> <div className="Line" style={{ backgroundColor: 'red' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" style={{ backgroundColor: 'yellow' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" style={{ backgroundColor: 'grey' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" style={{ backgroundColor: 'red' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" > <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" style={{ backgroundColor: 'white' }}> <div className="Line" style={{ backgroundColor: 'red' }}> <div className="Line" style={{ backgroundColor: 'white' }}> ) } }

// CSS body { height: 10000px; } .App { text-align: center; } .App-header { overflow: auto; position: fixed; left: 0; width: 100%; background-color: #282c34; min-height: 100vh; font-size: calc(10px + 2vmin); color: white; } .Square { position: fixed; overflow: auto; height: 100%; width: 100%; background-color: pink; margin: 20px auto; } .Button { height: 50px; width: 100px; } .Line { height: 50px; width: 100%; } `