Javascript I'；我使用上下文api和i'；我收到这个错误，我不知道'；我不知道该做什么

//StateProvider.js

export const initialState = {
basket: [],
};

const reducer = (state, action) => {
console.log(action.type);

switch (action.type) {
    case 'ADD_TO_BASKET':
        return {
            ...state,
            basket: [...state.basket, action.item],
        };
    default:
        return state;
}
};
export default reducer;

import React，{createContext，useContext，useReducer}来自“React”
//准备数据层
export const StateContext=createContext；
//包装我们的应用程序并提供数据层
export const StateProvider=（{reducer，initialState，children}）=>(
{儿童}
);
//从数据层提取信息
export const useStateValue=（）=>useContext（StateContext）；

错误：元素类型无效：需要字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。您可能忘记了从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入

检查

StateProvider

的呈现方法

---

这是我得到的错误

createContext是一个函数。因此，您需要执行

createContext（）

。谢谢Shyam。

export const initialState = {
basket: [],
};

const reducer = (state, action) => {
console.log(action.type);

switch (action.type) {
    case 'ADD_TO_BASKET':
        return {
            ...state,
            basket: [...state.basket, action.item],
        };
    default:
        return state;
}
};
export default reducer;

import React, { createContext, useContext, useReducer } from 'react'
//Prepare the data layer
export const StateContext = createContext;

//Wrap our app and provide the datalayer
export const StateProvider = ({ reducer, initialState, children }) => (
<StateContext.Provider value={useReducer(reducer, initialState)}>
    {children}
</StateContext.Provider>
);

//Pull information from Datalayer
export const useStateValue = () => useContext(StateContext);