How to write such JS code in React?

Question

JavaScript

There is a button that lowers the page to certain coordinates:

<div class="container">
<div class="down">
    <div class="down-text">DOWN
    <button onclick="topFunction2Section()" class="myBtn2" title="Down">&#10095;</button>
    </div>
</div>
</div>


<style>
    .container{
        background: yellow;
        height: 3000px;
        width: 100%;
    }
</style>


<script>
function topFunction2Section() {
           document.body.scrollTop = 940;
           document.documentElement.scrollTop = 940;
}
    </script>

Answer 1

const ScrollButton = props => {
  const onClick = () => window.scrollTo({
    top: props.scrollTo,
    behavior: 'smooth',
  });

  return (
    <div className="down" style={{ top: `${props.top}px` }}>
      Scroll to {props.scrollTo}
      <button onClick={onClick}>&#10095;</button>
    </div>
  );
};

const App = () => (
  <div className="container">
    <ScrollButton scrollTo={500} top={50} />
    <ScrollButton scrollTo={1000} top={100} />
    <ScrollButton scrollTo={2000} top={200} />
  </div>
);

.down {
  position: fixed;
}

https://jsfiddle.net/zm0x4ycj/