React语法错误：预期对应的JSX结束标记
齐胜涝
问题内容：
问题答案：
我是React的新手，我尝试从FreeCodeCamp做一个“坎普排行榜”项目。在StackOverflow代码段中，它抛出了我：
`“ message”：“ SyntaxError：内联Babel脚本：预期的JSX结束标记，请帮助我找出问题所在。这是代码：
"use strict";
class TableBox extends React.Component {
constructor(props) {
super(props);
this.state = {
data: []
};
}
loadCampersFromServer() {
fetch('https://fcctop100.herokuapp.com/api/fccusers/top/alltime')//alltime or recent
.then(
(response) => {
if (response.status !== 200) {
console.log('Looks like there was a problem. Status Code: ${response.status}');
return;
}
response.json().then((data) => {
console.log('getting data:', data);
this.setState({data: data});
})
}
)
.catch(function (err) {
console.log('Fetch Error :-S', err);
});
}
componentDidMount() {
this.loadCampersFromServer();
}
render() {
return <CampersList />;
}
}
class CampersList extends React.Component {
constructor(props) {
super(props);
}
render() {
console.log(this.state);
let campersNodes = this.state.data.map((element, index) => {
return (
<Camper user={element} index={index} />
);
});
return (
<table>
<tr>
<th>#</th>
<th>Camper Name</th>
<th>Points in past 30 days</th>
<th>All time points </th>
</tr>
{campersNodes}
</table>
)
}
}
class Camper extends React.Component{
constructor(props){
super(props);
}
render(){
<tr>
<td>{this.props.index}</td>
<td>
<img src = {this.props.user.img} alt="logo">
{this.props.user.userName}
</td>
<td>{this.props.user.recent}</td>
<td>{this.props.user.alltime}</td>
</tr>
}
}
ReactDOM.render(<TableBox />, document.getElementById('root'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>
问题答案：
您需要以img结束语关闭标签/>：
<img src={this.props.user.img} alt="logo" />
正确关闭标签时，JSX不如HTML宽容。
类似资料：
-
问题内容： 在具有输入字段的Reactjs中创建组件时发生错误 问题答案： 您需要以结尾关闭输入元素。
-
我不知道他们谁错了。
-
问题内容： 我正在尝试使用带有以下JSON 的POST请求批量导入： 我不断收到以下错误： 我尝试更改JSON格式，但没有帮助。似乎出了什么问题？ 问题答案： 您的格式不太正确：对于批量请求，单个项目用换行符（不是逗号）分隔，并且末尾没有方括号（即，有效负载是JSON文档序列，但整个有效负载本身不是有效的json文档） 您的数据应该看起来像
-
我得到了的意外结束。代码对我来说很好，我错过了什么？ 安慰：
-
问题内容： 我有一个SQL查询，当将其放入函数中时，它将停止处理此错误消息。从功能中删除它会使它再次开始工作。 为什么是这样？ 问题答案： 缩进的Heredoc分隔符将其破坏。说： 代替
-
我试图使用下面的代码从一个api网站获取一个JSON文件，但是当我使用下面的代码获取时，我得到一个错误，说“JSON输入意外结束”