FilesExpand file tree

 master

/

ScrollBox.js

Copy path

Blame

More file actions

Blame

More file actions

Latest commit

 

History

History

History

38 lines (37 loc) · 935 Bytes

 master

/

ScrollBox.js

Copy path

Top

File metadata and controls

• Code
• Blame

38 lines (37 loc) · 935 Bytes

Raw

Copy raw file

Download raw file

Open symbols panel

Edit and raw actions

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

import React, { Component } from 'react';

class ScrollBox extends Component {

scrollToBottom = () => {

const { scrollHeight, clientHeight } = this.box;

/* 앞 코드에는 비구조화 할당 문법을 사용했습니다.

다음 코드와 같은 의미입니다.

const scrollHeight = this.box.scrollHeight;

const clientHeight = this.box.cliengHeight;

*/

this.box.scrollTop = scrollHeight - clientHeight;

};

render() {

const style = {

border: '1px solid black',

height: '300px',

width: '300px',

overflow: 'auto',

position: 'relative'

};

const innerStyle = {

width: '100%',

height: '650px',

background: 'linear-gradient(white, black)'

};

return (

<div

style={style}

ref={ref => {

this.box = ref;

}}

>

<div style={innerStyle} />

</div>

);

}

}

export default ScrollBox;