← Усі задачіReact · Middle

Хук usePrevious

Напишіть хук usePrevious(value), який повертає значення value з попереднього рендеру. На першому рендері попереднього значення ще немає - поверніть undefined.

Такий хук допомагає порівняти пропс зі старим значенням, наприклад, щоб анімувати зміну числа.

function usePrevious(value) {
  // ...
}

Ctrl+Enter - запустити тести. Tab - відступ; щоб вийти з редактора клавіатурою, натисніть Esc, а потім Tab. Код зберігається в цьому браузері.

Тести (3)

const { result } = renderHook(({ v }) => usePrevious(v), { initialProps: { v: 1 } });
expect(result.current).toBe(undefined);

const { result, rerender } = renderHook(({ v }) => usePrevious(v), { initialProps: { v: 1 } });
rerender({ v: 2 });
expect(result.current).toBe(1);

const { result, rerender } = renderHook(({ v }) => usePrevious(v), { initialProps: { v: 'a' } });
rerender({ v: 'b' });
rerender({ v: 'c' });
expect(result.current).toBe('b');