5.3.4 컴포넌트에 ref 달고 내부 메서드 사용

    그럼 App 컴포넌트에서 ScrollBoxref를 달고 버튼을 만들어 누르면, ScrollBox 컴포넌트의 scrollToBottom 메서드를 실행하도록 코드를 작성하겠습니다.

    App.js

    import React, { Component } from 'react';
    import ScrollBox from './ScrollBox';
     
    class App extends Component {
      render() {
        return (
          <div>
            <ScrollBox ref={(ref) => this.scrollBox=ref}/>
            <button onClick={() => this.scrollBox.scrollToBottom()}>
               밑으로
            </button>
          </div>
        );
      }
    }
     
    export default App;

    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.