Check out example codes for "html scroll behavior". It will help you in understanding the concepts better.

Code Example 1

html {
  scroll-behavior: smooth;
}

// scroll-behaviour option
auto => Allows a straight jump "scroll effect" between elements within the scrolling box. This is default
smooth => Allows a smooth animated "scroll effect" between elements within the scrolling box.
initial => Sets this property to its default value.
inherit	=> Inherits this property from its parent element.

Code Example 2

html {
  scroll-behavior: smooth;
}

/* No support in IE, or Safari
You can use this JS polyfill for those */
http://iamdustan.com/smoothscroll/

Learn ReactJs, React Native from akashmittal.com