我的React应用程序出现“ Object(...)不是函数”错误
文件:SchemasContext.js
import React, { useState, createContext } from "react";
export const SchemasContext = createContext([]);
export const SchemasProvider = props => {
const [schemas, setSchemas] = useState([]);
return (
<SchemasContext.Provider value={[schemas, setSchemas]}>
{props.children}
</SchemasContext.Provider>
);
};
文件:Sidebar.js
import React from 'react';
import { Schemas } from './components.js'
import { SchemasProvider } from "../context/SchemasContext";
console.log('sidebar SchemasProvider: ', SchemasProvider);
function Sidebar() {
return (
<SchemasProvider>
<Schemas />
</SchemasProvider>
);
}
console.log('sidebar SchemasProvider: ', SchemasProvider);
语句似乎确认导入正确完成,它输出:
sidebar SchemasProvider:
SchemasProvider(props)
length: 1
name: "SchemasProvider"
prototype: Object { … }
<prototype>: function ()
但是我仍然遇到错误:
Sidebar.js:8
TypeError: Object(...) is not a function
SchemasContext.js:5
SchemasProvider SchemasContext.js:5
React 22
js index.js:6
Webpack 3
The above error occurred in the <SchemasProvider> component:
in SchemasProvider (created by Sidebar)
in Sidebar
Consider adding an error boundary to your tree to customize error handling behavior.
Visit <redacted> to learn more about error boundaries. react-dom.development.js:16764
TypeError: Object(...) is not a functionSchemasContext.js:5
SchemasProvider SchemasContext.js:5
React 18
js index.js:6
Webpack 3
谢谢!