0

我正在尝试使用 TypeScript 在 React 中呈现上下文提供程序。

以下代码以非常简单的方式代表了我想要实现的目标。

import * as React from "react";

public render() {
    let ctx = React.createContext("test");
    console.log(ctx.Provider);
    return (
        <ctx.Provider value={"hello world"}>
            <div>
                Hello
            </div>
        </ctx.Provider>);
}

一旦呈现此方法，就会显示此错误消息：

错误：元素类型无效：需要字符串（对于内置组件）或类/函数（对于复合组件），但得到：对象。at invariant (vendor.js?v=OjVxDpV6p_Jfz2P38F_R2lc3pjVsUisUejeIABZq7AE:118) at ReactCompositeComponentWrapper.instantiateReactComponent [as _instantiateReactComponent] (vendor.js?v=OjVxDpV6p_Jfz2P38F_R2lc3pjVsUisUejeIABZq7AE:20273) at ReactCompositeComponentWrapper.performInitialMount (vendor.js?v=OjVxDpV6p_Jfz2P38F_R2lc3pjVsUisUejeIABZq7AE:29799) at ReactCompositeComponentWrapper. mountComponent (vendor.js?v=OjVxDpV6p_Jfz2P38F_R2lc3pjVsUisUejeIABZq7AE:29690) at Object.mountComponent (vendor.js?v=OjVxDpV6p_Jfz2P38F_R2lc3pjVsUisUejeIABZq7AE:12868) at ReactCompositeComponentWrapper.performInitialMount (vendor.js?v=OjVxDpV6p_Jfz2P38F_R2lc3pjVsUisUejeIABZq7AE:

我在其他类似问题中查找了该问题，但我得到的答案只是更新软件包。

我的软件包似乎是以下版本的最新版本：

"@types/node": "10.3.2",
"@types/chart.js": "2.7.18",
"@types/codemirror": "0.0.56",
"@types/history": "4.7.2",
"@types/react": "16.4.7",           // <-------------
"@types/react-dom": "16.0.9",       // <-------------
"@types/react-hot-loader": "3.0.6",
"@types/react-router": "4.4.0",
"@types/react-router-dom": "4.3.1",
"@types/react-virtualized": "9.18.3",
"@types/webpack-env": "1.13.0",
"aspnet-webpack": "^2.0.1",
"aspnet-webpack-react": "3.0.0",
"awesome-typescript-loader": "4.0.1",
"chart.js": "2.7.2",
"css-loader": "0.28.4",
"csstype": "2.5.3",
"basscss": "8.0.4",
"colors.css": "3.0.0",
"normalize.css": "8.0.0",
"event-source-polyfill": "0.0.9",
"extract-text-webpack-plugin": "2.1.2",
"file-loader": "0.11.2",
"isomorphic-fetch": "2.2.1",
"jquery": "3.2.1",
"svg.js": "2.6.5",
"svg.panzoom.js": "1.2.0",
"json-loader": "0.5.4",
"popper.js": "1.0.1",
"react": "16.6.0",                // <-------------
"react-dom": "16.6.0",            // <-------------
"react-hot-loader": "3.1.3",
"react-router-dom": "4.3.1",
"react-virtualized": "9.19.1",
"style-loader": "0.18.2",
"typescript": "3.0.3",
"url-loader": "0.5.9",
"webpack": "2.5.1",
"webpack-cli": "^3.0.2",
"webpack-command": "^0.2.0",
"webpack-hot-middleware": "2.18.2"

有谁知道如何解决这个问题？

4

1 回答 1

1

经过数小时的搜索，我自己找到了解决方案。

解决方案是删除该dist文件夹，然后重新生成该文件夹，一切正常。

于 2018-11-05T12:08:10.263 回答