为什么我们应该使用来自“反应”的导入React

Question

我正在学习React js（ 如果是ii App.js模块），我必须导入React，因为 render（）
方法用于将JSX转换为dom元素，而在Person.js中，我们正在创建箭头函数，然后将其导出以便它可以被导入并在App模块的render函数中使用，就像我们在React中导入的App模块一样，它将在模块person中转换JSX并在DOM上渲染，但是当我们在Person中删除以下代码时抛出错误时。
js

import React from 'react' in Person.js

它引发错误

__如果我们在React类提供的方法（如render）中声明JSX，则 在使用JSX时，React’必须在作用域内， 这会导致错误。

有人可以解释一下吗

我）为什么我们需要在Person.js中导入react？

ii）为什么删除上述代码后会引发错误？

情况一）

Person.js

 import React from 'react'

 const person = () => {
 return <p>This is person module used inside app module</p>
 };

 export default person

情况二）

App.js

import React, { Component } from 'react';
import './App.css'
import Person from './Person/Person'

class App extends Component {
render() {
return (
  <div className="App">
    <h1>this is app module and i am being used as the root component</h1>
     <Person/>
  </div>
);}}

export default App;

Answer 1

如果您给Babel提供一些JSX，您会发现JSX只是React.createElementcall的糖。这就是为什么如果使用JSX我们需要导入React。

输入项

<p>This is person module used inside app module</p>

输出量

"use strict";

React.createElement(
  "p",
  null,
  "This is person module used inside app module"
);