React Hook "useEffect" 在函数 "shoes" 中被调用

Question

我收到以下错误：

React Hook "useEffect" 在函数 "shoes" 中被调用，它既不是 React 函数组件也不是自定义 React Hook 函数 react-hooks/rules-of-hooks

我不确定我的代码中到底有什么错误：

import React, {useState, useEffect} from 'react';

import "../App.css"

function shoes() {

    useEffect(() => {

        fetchItems();

    }, []);

    const fetchItems = async () => {

        const data = await fetch('xxxxxxxxxxxxxxxxxxxxx')

        console.log(data)

    };

    return ( < h1 className = "main" > Shoes < /h1> );

    }

}

export default shoes;

Answer 1

如此处所述，React 组件名称需要以大写字母开头。这是因为 React 将以小写字母开头的组件视为 DOM 标签。因此你应该命名它Shoes。

Answer 2

我还想添加对我有用的解决方案。这应该是一个组件，因此将第一个字母大写有效，但是如果您尝试创建一个钩子并且发生上述错误，那么use请在钩子的开头附加。例如useShoes()