React-custom-scrollbars: How to set initial scrollTop value to <Scrollbars> component?

[umer4ik]

I need to show Scrollbars with initial top offset, e.g.

<Scrollbars
  onScroll={handleScroll}
  autoHeight
  autoHeightMin={500}
  initialScrollTop={100}
>

Maybe i missed something in docs, but I didn't find any API for this

[danilvalov]

@umer4ik @akira3500
You can use the internal API:

componentDidMount () {
  const {scrollbar} = this.refs;  // scrollbar has access to the internal API

  scrollbar.scrollTop(100); // 100px
  // or: scrollbar.scrollToBottom();
}

render () {
  <Scrollbars
    ref='scrollbar'
    onScroll={handleScroll}
    autoHeight
    autoHeightMin={500}
  >
    <div/>
  </Scrollbars>
}

You can use any internal API methods from the following list:
https://github.com/malte-wessel/react-custom-scrollbars/blob/master/src/Scrollbars/index.js#L97-L211

Or you can use an access to elements using the internal API:

componentDidMount () {
  const {scrollbar} = this.refs;

  scrollbar.view.scrollTop = 100; // view is a <div /> with scrolling
}

You can read more about all elements in the internal API this.

[beaver91]

@danilvalov thanks 👍

[gsi-arturo]

Hi, firstly let me say thanks very much for the good work you did it here, now please need your assistance is there any way of calculate or knowing the scrollTop value of a div inside ScrollBarCustoms, what I try to do is to set scrollbar position to a predifined place in content like a anchor when user press a button ?

[gsi-arturo]

Already solve the issue using refs, asking for the offsetTop and setting this value as scrollTop of the ScrollBar component, thanks anyway.