javascript - ReferenceError：没有为上下文定义 React

Question

import './App.css';
import ComponentC from './components/ComponentC';

export const UserContext = React.createContext()
function App() {
  return (
    <div className="App">
      
      <UserContext.Provider value={"deneme"}>
        <ComponentC />
      </UserContext.Provider>

    </div>
  );
}

export default App;


import React from 'react'
import ComponentE from './ComponentE'

function ComponentC() {
    return (
        <div>
            <ComponentE />
        </div>
    )
}

export default ComponentC

import React from 'react'
import ComponentF from './ComponentF'


function ComponentE() {
    return (
        <div>
            <ComponentF />
        </div>
    )
}

export default ComponentE

import React from 'react'
import { UserContext } from "../App"


function ComponentF() {
    return (
        <div>
            <UserContext.Consumer>
                {
                    user => {
                        return <div>User Context value {user}</div>
                    }
                }
            </UserContext.Consumer>

        </div>
    )
}

export default ComponentF

我有错误 ReferenceError: React is not defined，我不明白为什么我在 react.js 中这么新，所以我需要一些帮助。谢谢。

标签： javascriptreactjsreact-nativecomponentsuse-context

Answer 1

您需要以某种方式实际拉入 React 库，在 HTML 页面中使用脚本标签，例如

    <script src="https://unpkg.com/react@17/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>

我建议在此处查看文档：https ://reactjs.org/docs/getting-started.html#try-react ，以获取入门和开始的建议。