Javascript 反应：未终止的JSX

我是一个比较新的反应。我试图在App.js组件中拆分代码。现在，我得到一个错误

  ./src/containers/App.js
Syntax error: Unterminated JSX contents (64:12)

  62 |           Toggler = {this.togglerPersonHandler} />
  63 |           {person}
> 64 |       </div>
     |             ^
  65 |      )
  66 |    }
  67 | }

/src/containers/App.js
语法错误：未终止的JSX内容（64:12）
62 | Toggler={this.togglerPersonHandler}/>
63 |{人}
> 64 |       
|             ^
65 |      )
66 |    }
67 | }

这是我的caffick.js文件（在src/components/caffick/caffick.js中）

从“React”导入React；
从“/campot.css”导入类；
const Ccockpit=（道具）=>{
const assignedClasses=[]；
让btnClass=''
btnClass=驾驶舱。红色；
国际单项体育联合会（联合国会员国）{
btnClass=驾驶舱。红色；
}
如果（props.cocperson.length尝试以下方法：

<Ccockpit
          cocPersonState = {this.state.showPerson}
          cocperson = {this.state.person}
          Toggler = {this.togglerPersonHandler} />


您缺少该div的结束标记，应该是
@Jayce444修复了它，但仍然得到相同的结束标记error@Jayce444好的，现在它抛出了一个未终止JSX内容的错误在完全相同的行上出现了完全相同的错误？另外，在您的
caffick.js
，render函数中，包含的div有一个拼写错误的prop，应该是“className”。您缺少c。这是因为您的JSX语法错误。您可以有
内容
或
。但是您有一个开始标记（
），但没有用
关闭它。将
更改为

import React, { Component } from 'react';
import classes from './App.css';
import Cperson from '../components/person/person.js';
import Ccockpit from '../components/cockpit/cockpit.js';

class App extends Component {
(some code here) 

render() {
(some code here) 
return (
      <div className={classes.App}>
      <Ccockpit>
          cocPersonState = {this.state.showPerson}
          cocperson = {this.state.person}
          Toggler = {this.togglerPersonHandler} />
          {person}

      </div>
     )
   }
}
export default App;

<Ccockpit
          cocPersonState = {this.state.showPerson}
          cocperson = {this.state.person}
          Toggler = {this.togglerPersonHandler} />