我很抱歉，如果这是一个错误的地方问这样的事情，但我找不到这个错误，因为我的生活。我甚至睡了它，今天早上再试了几个小时。
这是我的错误：
ERROR in ./src/components/results_instructor_view/weekly_report_results_instructor.js
Module build failed: SyntaxError: C:/Users/Temple/Source/Workspaces/LMS/TechAcademyLMS/TechAcademyLMS/Scripts/React-Redux-App/src/components/results_instructor_view/weekly_report_results_instructor.js: Unexpected token, expected , (139:4)
137 |
138 |
> 139 | } else {
| ^
140 |
141 | return (<h6>No weekly reports yet</h6>);
142 | }
@ ./src/containers/main_display_container.js 85:40-121
@ ./src/components/app.js
@ ./src/routes.js
@ ./src/Index.js
这是我的代码：
// libraries
import React, { Component } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
// Loader
import Loader from '../../components/loader/loader';
//actions
import { resultsInstructorViewAction } from '../../actions/Results/results_instructor_view_action';
class WeeklyReportResult extends Component {
componentDidMount() {
// getting the user info from the props/params
const userInfo = this.props.match.params.value.split(',');
// url for the getWeeklyReport
const url = `/SPA/getWeeklyReport?Id=${userInfo[1]}`;
this.props.resultsInstructorViewAction(url);
}
componentDidUpdate(prevProps, prevState) {
// set loaded to true
if (this.state.Loaded === false) {
this.setState({ Loaded: true });
}
}
render() {
// checking to see if the data exists
if (this.props.resultsInstructorView > [0]) {
const renderList = this.props.resultsInstructorView.map((item, i) => {
return (
// Key for error in console due to mapping
<div key={i}>
<hr className="style-two" />
<h4>Date Submitted: </h4><p>{item.Date}</p>
<h5>Course Position: </h5><p>{item.CoursePosition}</p>
<h5>Need Help: </h5><p>{item.NeedHelp}</p>
<h5>Materials and Supplies Needed: </h5><p>{item.MaterialsAndSupplies}</p>
<h5>Meetups: </h5><p>{item.Meetups}</p>
<h5>Positive Experiences: </h5><p>{item.Positives}</p>
<h5>Complaints: </h5><p>{item.Complaints}</p>
<h5>Hours Studied: </h5><p>{item.HoursStudied}</p>
<h5>Job Search: </h5><p>{item.JobSearch}</p>
<h5>Referral: </h5><p>{item.Referral}</p>
<h5>Miscellaneous: </h5><p>{item.Miscellaneous}</p>
<button type="button" className="btn btn-info btn-lg" onClick={this.toggleModal} id={item.DailyReportId}>
Give Feedback
</button>
</div>
);
});
}
// building the already responded daily reports
const renderAllList = this.props.resultsInstructorView.map((item, i) => {
if (item.Feedbacks.length > 0) {
return (
<Panel key={i} header={item.Date} eventKey={i} bsStyle="primary" className="text-center">
<hr className="style-two" />
<div className="text-left">
<h6><strong>Date Submitted :</strong> {item.Date}</h6>
<h6><strong>Course Position : </strong>{item.CoursePosition}</h6>
<h6><strong>Need Help : </strong>{item.NeedHelp}</h6>
<h6><strong>Materials and Supplies :</strong> {item.MaterialsAndSupplies}</h6>
<h6><strong>Positives : </strong>{item.Positives}</h6>
<h6><strong>Complaints :</strong> {item.Complaints}</h6>
<h6><strong>Hours Studied :</strong> {item.HoursStudied}</h6>
<h6><strong>Job Search :</strong> {item.JobSearch}</h6>
<h6><strong>Referral :</strong> {item.Referral}</h6>
<h6><strong>Miscellaneous :</strong> {item.Miscellaneous}</h6>
<h6><strong>Instructor Feedback : </strong><mark>{item.Feedbacks[0].Content}</mark></h6>
</div>
</Panel>
);
}
return (
<div className="container text-center">
<div className="row">
<h1>Weekly Reports</h1>
<h3>Student Name: </h3><h5>{this.props.match.params.value.split(',')[2]}</h5>
</div>
<div className="col-sm-12 text-left">
{renderList}
<hr className="style-two" />
<h2 className="text-center">Past Reports</h2>
<Accordion>
{renderAllList}
</Accordion>
<FeedbackModal
show={this.state.isOpen}
toggleModal={this.toggleModal}
name={this.props.match.params.value.split(',')[0]}
id={this.props.match.params.value.split(',')[1]}
weeklyReportId={this.state.tempId}
/>
</div>
</div>
);
} else {
return (<h6>No weekly reports yet</h6>);
}
}
}
function mapStateToProps(state) {
return { resultsInstructorView: state.ResultsInstructorView };
}
function mapDispatchToProps(dispatch) {
return bindActionCreators({
resultsInstructorViewAction
}, dispatch);
}
export default connect(mapStateToProps, mapDispatchToProps)(WeeklyReportResult);
答案 0 :(得分：2)
else语句应该在第二个return语句之前，如下所示：
render() {
if (this.props.resultsInstructorView > [0]) {
return (
//code here
);
} else {
return (
//code here.
);
}
答案 1 :(得分：0)
看起来您应该首先修复该代码的格式 - 这有助于简化阅读和查找问题：）
}之前的else目前与{调用的resultsInstructorview.map()匹配，因此这不是有效的语法。
答案 2 :(得分：0)
老实说，您似乎错过了地图功能的结束括号。正确的代码缩进有助于找到这样的错误。
如果这确实是你想要的方式，那么这就是错误所指出的。您目前的代码看起来有点像这样：
if (item.Feedbacks.length > 0) {
return (<Panel>...</Panel>)
}
return (<div className="container text-center">...</div>)
else {
return (<h6>...</h6>)
}
中间的return语句使else语句无法访问。
您需要使用else if之类的内容对中间返回语句进行编辑，或将else子句放在中间返回语句之上。
虽然这比你的问题稍微宽泛一点，但实际上可能会解决它。看起来这些其他语句根本不应该在您的map函数中。