React JS中出现Uncaught TypeError: not a function or iterable报错求助

你的报错根源是拼写错误：在GlobalState.js中，你把React的useReducer Hook拼写成了useReduer，少了一个字母c，导致React无法识别这个函数，从而抛出错误。

修正步骤： #

打开GlobalState.js，将两处useReduer改为useReducer：

修正后的GlobalState.js代码：

import React, { createContext, useReducer } from 'react';
import AppReducer from './AppReducer';

const initialState = {
    transactions: [
        { id: 1, text: 'Flower', amount: -20 },
        { id: 2, text: 'Salary', amount: 300 },
        { id: 3, text: 'Book', amount: -10 },
        { id: 4, text: 'Camera', amount: 150 }
    ]
}

export const GlobalContext = createContext(initialState);

export const GlobalProvider = ({ children }) => {
    const [state, dispatch] = useReducer(AppReducer, initialState);

    return (<GlobalContext.Provider value={{
        transactions: state.transactions
    }}>
        {children}
    </GlobalContext.Provider>);
}

补充说明： #

useReducer是React提供的用于管理复杂状态的Hook，拼写错误会让程序把它当成一个未定义的变量，进而触发类似"不是函数或可迭代对象"的报错。修正拼写后，你的状态管理逻辑就能正常运行了。

内容的提问来源于stack exchange，提问作者Harshith