Sobes.tech
Middle

Ar kuriem hooks strādājāt funkcionālajās komponentēs? Kurš bija visneparastākais?

sobes.tech AI

Atbilde no AI

React funkcionālajās komponentēs bieži tiek izmantoti šādi hooki:

  • useState — stāvokļa pārvaldībai.
  • useEffect — blakus efektiem (pieprasījumi, abonementi).
  • useContext — konteksta pieejai.
  • useRef — mainīgu vērtību glabāšanai un DOM pieejai.
  • useMemo un useCallback — veiktspējas optimizācijai.

Visneparastākais hook, ar kuru esmu strādājis, varētu būt useImperativeHandle. Tas ļauj konfigurēt instanci, kas būs pieejama vecāku komponentam caur ref. Tas ir noderīgi, kad nepieciešams kontrolēt, kuras metodes vai īpašības ir pieejamas no ārpuses, īpaši, strādājot ar DOM elementu ietvariem vai trešo pušu bibliotēkām.

useImperativeHandle piemērs:

import React, { useImperativeHandle, forwardRef, useRef } from 'react';

const FancyInput = forwardRef((props, ref) => {
  const inputRef = useRef();

  useImperativeHandle(ref, () => ({
    focus: () => {
      inputRef.current.focus();
    }
  }));

  return <input ref={inputRef} {...props} />;
});

// Vecāku komponenta var izsaukt focus metodi:
// const ref = React.createRef();
// <FancyInput ref={ref} />
// ref.current.focus();