ошибка Аргумент типа "AsyncThunkAction<TIngredient[], void, AsyncThunkConfig>" нельзя назначить параметру типа "UnknownAction". в коде import { useState, useRef, useEffect, FC } from 'reac

Вопрос пользователя:

ошибка Аргумент типа "AsyncThunkAction<TIngredient[], void, AsyncThunkConfig>" нельзя назначить параметру типа "UnknownAction". в коде import { useState, useRef, useEffect, FC } from 'react'; import { useInView } from 'react-intersection-observer'; import { useSelector, useDispatch } from 'react-redux'; import { TTabMode } from '@utils-types'; import { BurgerIngredientsUI } from '../ui/burger-ingredients'; import { fetchIngredients, getIngredients } from '../../services/slices/ingredientSlice'; export const BurgerIngredients: FC = () => { /** TODO: взять переменные из стора */ const ingredients = useSelector(getIngredients); const dispatch = useDispatch(); useEffect(() => { dispatch(fetchIngredients()); }, [dispatch]); const buns = ingredients.filter((ingredient) => ingredient.type === 'bun'); const mains = ingredients.filter((ingredient) => ingredient.type === 'main'); const sauces = ingredients.filter((ingredient) => ingredient.type === 'sauce'); // const buns = []; // const mains = []; // const sauces = []; const [currentTab, setCurrentTab] = useState<TTabMode>('bun'); const titleBunRef = useRef<HTMLHeadingElement>(null); const titleMainRef = useRef<HTMLHeadingElement>(null); const titleSaucesRef = useRef<HTMLHeadingElement>(null); const [bunsRef, inViewBuns] = useInView({ threshold: 0 }); const [mainsRef, inViewFilling] = useInView({ threshold: 0 }); const [saucesRef, inViewSauces] = useInView({ threshold: 0 }); useEffect(() => { if (inViewBuns) { setCurrentTab('bun'); } else if (inViewSauces) { setCurrentTab('sauce'); } else if (inViewFilling) { setCurrentTab('main'); } }, [inViewBuns, inViewFilling, inViewSauces]); const onTabClick = (tab: string) => { setCurrentTab(tab as TTabMode); if (tab === 'bun') titleBunRef.current?.scrollIntoView({ behavior: 'smooth' }); if (tab === 'main') titleMainRef.current?.scrollIntoView({ behavior: 'smooth' }); if (tab === 'sauce') titleSaucesRef.current?.scrollIntoView({ behavior: 'smooth' }); }; return null; return ( <BurgerIngredientsUI currentTab={currentTab} buns={buns} mains={mains} sauces={sauces} titleBunRef={titleBunRef} titleMainRef={titleMainRef} titleSaucesRef={titleSaucesRef} bunsRef={bunsRef} mainsRef={mainsRef} saucesRef={saucesRef} onTabClick={onTabClick} /> ); }; как исправить

Ответ нейросети:

Пройдите быструю авторизацию для просмотра:

Ошибка возникает из-за того, что вы пытаетесь вернуть два раза из компонента BurgerIngredients. Вам нужно удалить первый return null; и оставить только return с JSX элементом BurgerIngredientsUI.

Исправленный код:

export const BurgerIngredients: FC = () => {
  /** TODO: взять переменные из стора */

  const ingredients = useSelector(getIngredients);
  const dispatch = useDispatch();

  useEffect(() => {
    dispatch(fetchIngredients());
  }, [dispatch]);

  const buns = ingredients.filter((ingredient) => ingredient.type === 'bun');
  const mains = ingredients.filter((ingredient) => ingredient.type === 'main');
  const sauces = ingredients.filter((ingredient) => ingredient.type === 'sauce');

  const [currentTab, setCurrentTab] = useState<TTabMode>('bun');
  const titleBunRef = useRef<HTMLHeadingElement>(null);
  const titleMainRef = useRef<HTMLHeadingElement>(null);
  const titleSaucesRef = useRef<HTMLHeadingElement>(null);

  const [bunsRef, inViewBuns] = useInView({
    threshold: 0
  });

  const [mainsRef, inViewFilling] = useInView({
    threshold: 0
  });

  const [saucesRef, inViewSauces] = useInView({
    threshold: 0
  });

  useEffect(() => {
    if (inViewBuns) {
      setCurrentTab('bun');
    } else if (inViewSauces) {
      setCurrentTab('sauce');
    } else if (inViewFilling) {
      setCurrentTab('main');
    }
  }, [inViewBuns, inViewFilling, inViewSauces]);

  const onTabClick = (tab: string) => {
    setCurrentTab(tab as TTabMode);
    if (tab === 'bun')
      titleBunRef.current?.scrollIntoView({ behavior: 'smooth' });
    if (tab === 'main')
      titleMainRef.current?.scrollIntoView({ behavior: 'smooth' });
    if (tab === 'sauce')
      titleSaucesRef.current?.scrollIntoView({ behavior: 'smooth' });
  };

  return (
    <BurgerIngredientsUI
      currentTab={currentTab}
      buns={buns}
      mains={mains}
      sauces={sauces}
      titleBunRef={titleBunRef}
      titleMainRef={titleMainRef}
      titleSaucesRef={titleSaucesRef}
      bunsRef={bunsRef}
      mainsRef={mainsRef}
      saucesRef={saucesRef}
      onTabClick={onTabClick}
    />
  );
};

Напишите нам, если в вопросе есть ваши персональные данные (yasnoponyatno24@yandex.ru)

export const BurgerIngredients: FC = () => {
  /** TODO: взять переменные из стора */

  const ingredients = useSelector(getIngredients);
  const dispatch = useDispatch();

  useEffect(() => {
    dispatch(fetchIngredients());
  }, [dispatch]);

  const buns = ingredients.filter((ingredient) => ingredient.type === 'bun');
  const mains = ingredients.filter((ingredient) => ingredient.type === 'main');
  const sauces = ingredients.filter((ingredient) => ingredient.type === 'sauce');

  const [currentTab, setCurrentTab] = useState<TTabMode>('bun');
  const titleBunRef = useRef<HTMLHeadingElement>(null);
  const titleMainRef = useRef<HTMLHeadingElement>(null);
  const titleSaucesRef = useRef<HTMLHeadingElement>(null);

  const [bunsRef, inViewBuns] = useInView({
    threshold: 0
  });

  const [mainsRef, inViewFilling] = useInView({
    threshold: 0
  });

  const [saucesRef, inViewSauces] = useInView({
    threshold: 0
  });

  useEffect(() => {
    if (inViewBuns) {
      setCurrentTab('bun');
    } else if (inViewSauces) {
      setCurrentTab('sauce');
    } else if (inViewFilling) {
      setCurrentTab('main');
    }
  }, [inViewBuns, inViewFilling, inViewSauces]);

  const onTabClick = (tab: string) => {
    setCurrentTab(tab as TTabMode);
    if (tab === 'bun')
      titleBunRef.current?.scrollIntoView({ behavior: 'smooth' });
    if (tab === 'main')
      titleMainRef.current?.scrollIntoView({ behavior: 'smooth' });
    if (tab === 'sauce')
      titleSaucesRef.current?.scrollIntoView({ behavior: 'smooth' });
  };

  return (
    <BurgerIngredientsUI
      currentTab={currentTab}
      buns={buns}
      mains={mains}
      sauces={sauces}
      titleBunRef={titleBunRef}
      titleMainRef={titleMainRef}
      titleSaucesRef={titleSaucesRef}
      bunsRef={bunsRef}
      mainsRef={mainsRef}
      saucesRef={saucesRef}
      onTabClick={onTabClick}
    />
  );
};

ЯсноПонятно24

Пройдите быструю авторизацию для просмотра:

Пройдите быструю авторизацию для просмотра:

Последние вопросы: