How can I scroll a div to be visible in ReactJS?

Question

I have a popup list which is a div that contains a vertical list of child divs. I have added up/down keyboard navigation to change which child is

Answer 1

I had a NavLink that I wanted to when clicked will scroll to that element like named anchor does. I implemented it this way.

  this.scrollToHref('plans')}>Our Plans
  scrollToHref = (element) =>{
    let node;
    if(element === 'how'){
      node = ReactDom.findDOMNode(this.refs.how);
      console.log(this.refs)
    }else  if(element === 'plans'){
      node = ReactDom.findDOMNode(this.refs.plans);
    }else  if(element === 'about'){
      node = ReactDom.findDOMNode(this.refs.about);
    }

    node.scrollIntoView({block: 'start', behavior: 'smooth'});

  }

I then give the component I wanted to scroll to a ref like this