Реагировать функциональные компоненты - скажем, это не функция

Question

Я использую функциональные компоненты реагирования (ловушки обучения Infact), поэтому я сталкиваюсь с одной проблемой при вызове функции из другой функции

вот мой код

мой функциональный компонент

    const LiteraryPage = props => {
      if (Object.keys(mainData).length === 0 && mainData.constructor === Object) {
        setMainDataSection(validateData(mainData));
      }
      const validateData = async (data) => {
    let finalDataArray = [];
    if (data.cars !== undefined) {
      finalDataArray = finalDataArray.concat(data.cars);
    }
    if (data.mobiles !== undefined) {
      finalDataArray = finalDataArray.concat(data.mobiles);
    }
    if (data.scooters !== undefined) {
      finalDataArray = finalDataArray.concat(data.scooters);
    }
    return finalDataArray;
  };


    }

Но я получаю сообщение об ошибке

Uncaught TypeError: validateData не является функцией

Пожалуйста, исправьте меня, если что-то отсутствует или если я ошибаюсь в каком-то месте.

Answer 1

Возможно, вы устанавливаете состояние непосредственно внутри функционального компонента, когда вызываете validate data и setMainDataSection.

Итак, во-первых, вам нужно определить validateData перед его использованием, а во-вторых, вам нужно выполнить проверку в useEffect

const LiteraryPage = props => {
  const validateData = async (data) => {
    let finalDataArray = [];
    if (data.cars !== undefined) {
      finalDataArray = finalDataArray.concat(data.cars);
    }
    if (data.mobiles !== undefined) {
      finalDataArray = finalDataArray.concat(data.mobiles);
    }
    if (data.scooters !== undefined) {
      finalDataArray = finalDataArray.concat(data.scooters);
    }
    return finalDataArray;
  };
  useEffect(() => {
    if (Object.keys(mainData).length === 0 && mainData.constructor === Object) {
      setMainDataSection(validateData(mainData));
    }
  }, []);

}