Lo hice con reaccionar y cada vez que vuelvo a cargar el sitio, muestra la sección de contacto en lugar del encabezado primero incluso después de implementarlo: aquí está el enlace al sitio web
const Form = ({ emailSent, setEmailSent }) => { return ( <Box component="form" ref={form} onSubmit={sendEmail} validate> <Grid container spacing={2}> <Grid item xs={12}> <TextField autoComplete="given-name" name="user_name" required fullWidth id="name" label="Name" autofocus /> </Grid> <Grid item xs={12}> <TextField required fullWidth id="email" label="Email Address" name="user_email" autoComplete="email" /> </Grid> </Grid> <Button type="submit" variant="outlined" sx={{ mt: 3, mb: 2, border: "1px solid #9F9F9F", color: "#9F9F9F" }} > send </Button> </Box> ); }; export default Form;Proporcione el fragmento de código apropiado. No es un enlace directo para que otros lo depuren. Es difícil para los demás también.
Su problema es esta línea de código en Form.js
<Grid item xs={12}> <TextField autoComplete="given-name" name="user_name" required fullWidth id="name" label="Name" autoFocus // this is making it scroll to the input box /> autoFocus enfocará esa entrada automáticamente cuando se carga la página, esa es la razón por la que su página se desplaza a la sección de contacto.