Saltar al contenido

Responder usando ganchos anteriores

Responder usando ganchos anteriores

Los ganchos son esenciales para el patrón de componentes funcionales en React. Una comparación lógica común con class Componentes fue una comparación con uno anterior. prop Vale la pena con una corriente prop Valor a través de métodos de ciclo de vida. Entonces, ¿qué es un patrón simple para duplicar comparaciones de valores anteriores en componentes funcionales?

los useRef y useEffect Los hooks nos permiten gestionar la misma funcionalidad en componentes funcionales a través de un hook personalizado – usePrevious:

import { useEffect, useRef } from 'react';

export function usePrevious(value) {
  const ref = useRef();
  useEffect(() => {
    ref.current = value;
  }, [value]);
  return ref.current;
}

// Usage
export function MyComponent(props) {
  const { name } = props;
  const previousName = usePrevious(name);

  if(name != previousName) {
    // Do something
  }
}

me encanta usePrevious Hook, aunque solo sea porque a menudo me olvido de usarlo .current Propiedad y ayuda a evitar el código repetitivo. ¿Qué opinas de este patrón? ¿Tiene ganchos personalizados en los que confía?

  • Consejos para comenzar con Bitcoin y las criptomonedas

    Consejos para comenzar con Bitcoin y las criptomonedas

    Una de las experiencias más gratificantes de mi vida, tanto financiera como lógicamente, fue comprar y administrar criptomonedas como Bitcoin, Litecoin, Ethereum. Como cualquier otra tecnología nueva, he cometido errores de novato, pero he aprendido algunas de las mejores prácticas en el proceso. Dinero en efectivo…

  • Escribe mejor JavaScript con promesa

    Escribe mejor JavaScript con promesa

    Probablemente hayas escuchado hablar sobre el enfriador de agua, cómo las promesas son el futuro. Todos los niños geniales los usan, pero no puedes ver qué los hace especiales. ¿No puedes usar una devolución de llamada? ¿Cual es el problema? En este artículo vamos a …

  • Complemento MooTools CountDown

    Complemento MooTools CountDown

    Existen numerosos sitios web en Internet, como RapidShare, que requieren que espere una cierta cantidad de tiempo antes de recibir su recompensa. Con MooTools creé un complemento CountDown que te permite implementar fácilmente un sistema similar. El JavaScript de MooTools La clase CountDown …

  • Crea una imagen panorámica en 3D con A-Frame

    Crea una imagen panorámica en 3D con A-Frame

    En los cinco años que he estado con Mozilla, he visto grandes proyectos. Algunos de ellos son muy populares, otros muy especializados, pero ninguno de ellos me inspiró sobre cómo funciona el equipo de MozVR con WebVR y también Un cuadro Tener proyecto. A-Frame es un proyecto conjunto …


Source link