Uso de ganchos de reacción simple

import React, { useState, useEffect } from 'react';
export default function User(){
    const [date, setDate] = useState(new Date());
    useEffect(() => {
        const timeId = setInterval(() => {
            setDate(new Date());
        }, 1000);
        return () => clearInterval(timeId);
    })
    retrun <div>{date.toLocaleTimeString()}</div>
}

Nota: useEffect agrega la capacidad de realizar operaciones de efectos secundarios para componentes de funciones

Optimización:

1. Configurar dependencias

// Establecer una matriz vacía significa que no hay dependencias, la operación de efectos secundarios solo se realiza una vez

useEffect (() => {...}, [])

useEffect () => {...}, [fruta])

2. Trabajo de compensación:

El retorno después de useEffect puede borrar algunas cosas como los temporizadores que deben borrarse.