scroll to the top of page in reactjs

user_14688138 0
Viewed 579

I am designing the registration page in Reactjs .and I am doing manual validation. now what I want is after clicking onSubmit, the page should scroll to the top to show all errors in the validation.I tried but failed to achieve this.is there anyone who will help me

react-router react-hooks reactjs javascript
2 Answers

This line of code works for me

window.scrollTo(0, 0);
user_157376570

If you task is to scroll to errors rather than scrolling to top, you can try this.

import React { useRef } from 'react';

const Component = () => {
    const errorRef = useRef(null);

    const onSubmitHandler = () => {
        ...
        errorRef.current.scrollIntoView();
    }

    return (
        ...
        <div ref={errorRef} className='error-container'>
            ...
        </div>
        ...
    );
}

Note: Still you want to try scroll to top you can try this.

window.scrollTo(0,0);

or

window.scrollTo({
    top: 0,
    left: 0,
    behavior: 'smooth'
});
user_104069950
Related