がonScroll私はコンポーネントをシンプルに反応している

Question

を発射ない反応して、私はそのコンポーネントにイベントをonScroll設定が、私はそれが

import React, { Component, PropTypes } from 'react' 

export default class MyComponent extends Component { 
    _handleScroll(e) { 
    console.log('scrolling') 
    } 

    render() { 
    const style = { 
     width: '100px', 
     height: '100px', 
     overflowY: 'hidden' 
    } 
    const innerDiv = { 
     height: '300px', 
     width: '100px', 
     background: '#efefef' 
    } 
    return (
     <div style={style} onScroll={this._handleScroll}> 
     <div style={innerDiv}/> 
     </div> 
    ) 
    } 
} 

Answer 1

を発射ないのスクロールするときには、DOM要素に参照を追加する必要があります。

React onScroll not working

class ScrollingApp extends React.Component { 

    _handleScroll(ev) { 
     console.log("Scrolling!"); 
    } 
    componentDidMount() { 
     const list = ReactDOM.findDOMNode(this.refs.list) 
     list.addEventListener('scroll', this._handleScroll); 
    } 
    componentWillUnmount() { 
     const list = ReactDOM.findDOMNode(this.refs.list) 
     list.removeEventListener('scroll', this._handleScroll); 
    } 
    /* .... */ 
} 

Answer 2

コンストラクタで_handleScrollイベントをバインドする必要があります。これをコンポーネントに追加してみてください。

constructor() { 
    this._handleScroll = this._handleScroll.bind(this); 
} 

https://facebook.github.io/react/docs/handling-events.html

Answer 3

あなたはautoまたはscrollにoverflowYの値を変更する必要があります。 hiddenはスクロールバーを非表示にするため、スクロールバーが表示されません。