ユニバーサルリアクションアプリがサーバー側の最初の画面レンダリングを終えた後で、どのようにリファレンスにアクセスするのですか？

Question

私はサーバー側の最初の画面ページをレンダリングする汎用のReact + Reduxアプリケーションを持っています。そして、ブラウザ側のReactJSは残りのタスクを完了します。

現在、私は、私は、ユーザーがページをスクロールしている間、私はReactDom要素を取得する必要がある 2. ref={(ref) => this.xxx = ref}

componentDidMount() { 
    // The code in handleScroll cannot get this.xxx, as it would print the error 
    // Uncaught TypeError: Cannot read property 'xxx' of null 
    window.addEventListener('scroll', this.handleScroll); 
    // Code below can get the rect numbers. 
    console.log(this.xxx.getBoundingClientRect()); 
} 

handleScroll(event) { 
    if (this.xxx !== null) { 
    console.log(this.xxx.getBoundingClientRect()); 
    } 
} 

を使用して、引用文献にアクセスし、上のいくつかのことを行うことができない、問題に会いましたその要素。しかし、私がcomponentDidMount（）のrefsにしかアクセスできない場合、どうすればいいのですか？

ありがとうございました。

Answer 1

デバッグを試して、handleScrollにブレークポイントを設定して、 'this'で何が得られるかを確認してください。あなたは他の参考文献や状態を見ることができますか？

あなたはそれはのように、場合に役立ちます、handleScrollに「これを」結合試すことができます。

window.addEventListener('scroll', this.handleScroll.bind(this));