React Hook useMemo有一个不必要的依赖：'匹配'

Question

this my code

const Head: FC<{ match: faceMatch<{}> }> = ({ match }) => {
  const [arrProd, setArrProd] = useState<JSX.Element[]>([]);
  const [ImgCatIndx, setImgCatIndx] = useState<number>(0);
  const [resError, setResError] = useState<string>("");
  useMemo(() => {
    setImgCatIndx(0);

  }, [match]);//warning React Hook useMemo has an unnecessary dependency 

  useEffect(() => {
    const abortController = new AbortController();
    const signal = abortController.signal;
    document.title = `Hat Jacket Pants Shoes Suit | Amasia`;
    (async () => {
      setArrProd([]);
      setResError("");
      try {
        const Res = await fetch(
          `https://foo0022.firebaseio.com/New/${headcateg[ImgCatIndx]}.json`,
          {
            signal: signal
          }
        );
        if (!Res.ok) {
          throw new Error("Page Not Found 404");
        }
        const ResObj = await Res.json();
        const ResArr = await Object.values(ResObj).flat();
        await setArrProd(
          ResArr.map(
            ({
              to,
              id,
              price,
              src,
              title,
              sold,
              shipping
            }: faceProductList) => (
              <Fragment key={id}>
                <NavLink to={to}>
                  <img
                    src={`/${src[0]}`}
                    alt={title}
                    height={"220px"}
                    width={"220px"}
                  />
                  <span>{price}</span>
                  <span>{shipping}</span>
                  <span>{sold}</span>
                </NavLink>
              </Fragment>
            )
          )
        );
      } catch (error) {
        if (error.name !== "AbortError") {
          setResError(error.message);
        }
      }
    })();
    return () => {
      abortController.abort();
    };
  }, [ImgCatIndx]);

  if (resError !== "") {
    return <HandlerErr error={resError} />;
  } else if (!arrProd.length) {
    return <Loding />;
  }
return(....)

I get in the console.

React Hook useMemo has an unnecessary dependency: 'match'. Either exclude it >or remove the dependency array.

I want When changing the match has changed and ImgCatIndx = 0.it's not clear why I'm getting a warning here..How can this be related..How to fix the warning?

Answer 1

您应该使用useEffect而不是useMemo。如果您使用react路由器，则匹配对象会在更新历史记录时更改，即使传递相同的参数并正确传输参数本身也是如此。