Неверный вызов ловушки при динамическом импорте компонентов - PullRequest
Новая
       29

Неверный вызов ловушки при динамическом импорте компонентов

0 голосов
/ 24 сентября 2019

У меня есть эта настройка:

Компонент A, который использует хук

Компонент B, который импортирует компонент A

При тестировании B я динамически импортирую его сrequire(B) на beforeEach и сброс модулей через jest.resetModules() Выполнение динамического импорта для обновления других проверенных значений.

Это, кажется, вызывает Invariant Violation: Invalid hook call.Я не совсем уверен, почему это происходит.Кто-нибудь сталкивался с этим?Что может быть здесь исправлено?

Вот надуманный пример https://codesandbox.io/s/cocky-hodgkin-gz1tl, по какой-то причине он отлично работает в песочнице, но локально дает сбой

1 Ответ

1 голос
/ 24 сентября 2019

Проблема в том, что ваш Item возвращает оба состояния и функции через items. 

export function Item() {
  const items = React.useState([123, 234, 768]);
  return <div>Items - {items}</div>; <--- problem
}

С useState():

Он возвращает пару значений: текущее состояние и функцию, которая его обновляет.

Так и должно быть: 

export function Item() {
  const [items, setItems] = React.useState([123, 234, 768]);
  return <div>Items - {items}</div>;
}

или 

return <div>Items - {items[0]}</div> <--- return state only
...