React Bootstrap Modal滚动到顶部

Question

I have React Bootstrap modal that contains a form. When the form validates, it displays the errors at the top of the form. Because the form is large, these errors are not visible.

I need the modal to scroll back to the top.

I have tried attaching a ref to the modal and using scrollTop but it doesn't seem to work - like this

<Modal ref={el => (this.modal = el)} ......... />

Then; this.modal.scrollTop = 0

Answer 1

You can use scrollTop only for the DOM element and not the React component class, To get the DOM element make use of ReactDOM.findDOMNode() like

<Modal ref={el => (this.modal = el)} ......... />

const modalDOM = ReactDOM.findDOMNode(this.modal);
modalDOM.scrollTop = 0