Reactjs map不是一个如何在react/typescript/redux中求解的函数

我想使用typescript/react/redux_thunk获取一个api数据，并使用该数据创建一个简单的应用程序

这是我的密码：

type.tsx: 
       export interface Iproduct {
      id: number;
      title: string;
      price: number;
      description: string;
      category: string;
      image: string;
    }

行动

 import { Iproduct } from "../types/type";
     export const getProduct = () => (dispatch: any) => {
          axios
            .get<Iproduct[]>("https://fakestoreapi.com/products")
            .then((res) => dispatch({ type: "GET_PRODUCT", payload: res.data }))
            .catch((err) => {
              console.log(err);
            });
        };

App.tsx：

 const state = useSelector((state: Iproduct[]) => state);
      const dispatch = useDispatch();
      const [products, setproducts] = useState<Iproduct[]>([]);
    
      useEffect(() => {
        dispatch(getProduct());
      }, []);
    
      useEffect(() => {
        setproducts(state);
        products.forEach((e: Iproduct) => console.log(e));
      });

const state=useSelector（（状态：IPProduct[]）=>state）；
const dispatch=usedpatch（）；
const[products，setproducts]=useState（[]）；
useffect（（）=>{
调度（getProduct（））；
}, []);
useffect（（）=>{
setproducts（州）；
products.forEach（（e:ipproduct）=>console.log（e））；
});

我想在app.tsx文件中使用useSelector接收到的数据内部进行映射，但我遇到了一个错误

“TypeError:products.map不是函数”

如果你告诉我我是在哪里做的，我会很高兴。我不能解决这样的错误，因为我刚刚学会打字

---

注意：我在项目中使用了redux thunk，您可能发送了不同的代码，但我想我理解。当第一次加载组件时，它是未定义的，因为您没有发出任何请求，并且产品数据没有更改。解决这个问题的最简单方法是使用

---

state=>（state.products | |[]）.map（value=>…）

尝试替换reducer中的以下代码

export const reducer = (state = INITALIZE_STATE, action: Action) => {
     switch (action.type) {
      case "GET_PRODUCT":
        return { ...state, products: [action.payload] };
      default:
        return state;
    }
  }; 

---

我看不到您在代码中的任何地方调用

products.map

。？从另一个状态派生的fwiw状态是一种反模式。在这里，您正在从redux状态创建一个react状态，这并不好。

export const reducer = (state = INITALIZE_STATE, action: Action) => {
     switch (action.type) {
      case "GET_PRODUCT":
        return { ...state, products: [action.payload] };
      default:
        return state;
    }
  };