Ошибка реагирования: неверный вызов ловушки. Хуки могут быть вызваны только внутри тела компонента функции - PullRequest
Новая
       10

Ошибка реагирования: неверный вызов ловушки. Хуки могут быть вызваны только внутри тела компонента функции

1 голос
/ 23 марта 2020

Я проверил нарушения 2 хуков, у меня одинаковые версии реагировать и реагировать, и у меня нет дубликатов реакции. Я не могу понять, в чем ошибка на самом деле?

index. js: 3221 Неполученное инвариантное нарушение: Недопустимый вызов ловушки. Хуки могут быть вызваны только внутри тела компонента функции .
Это может произойти по одной из следующих причин:
1. Возможно, у вас не совпадают версии React и средства визуализации (например, React DOM )
2. Возможно, вы нарушаете правила хуков
3. У вас может быть более одной копии React в одном приложении

У меня есть набор фильтров, которые я хочу показать пользователю: 

import Chip from "@material-ui/core/Chip";
import React, { Fragment } from "react";
import Text from "@material-ui/core/text";

function RenderFilter(props) {
  return (
    <Fragment>
      <RenderHeader />
      <RenderX {...props} />
      <RenderSomething {...props} />
    </Fragment>
  );


function RenderSomething(props) {
  const { filters } = props;
  const allowedKeys = Object.keys(filters);
  return (
    <div>
      {allowedKeys.map((item, index) => (
        <Fragment key={index}>
          <div
            style={{
              display: "flex",
              justifyContent: "space-between",
              margin: "8px 0px"
            }}
          >
            <div style={{ borderBottom: "1px #f6f6f6" }}>
              <div style={{ maxWidth: 200 }}>
                <Text>{item}</Text>
              </div>
              <div>
                {filters[item].map(ele => (
                  <Chip key={`${ele}`} color="primary" label={`${ele}`} />
                ))}
              </div>
            </div>
          </div>
        </Fragment>
      ))}
    </div>
  );
}
...