as shown in the picture, I cited react.js and babel.js directly in the page to report errors on the Internet to check whether it seems to be using es5 or es6. Is there a big god who has encountered this situation to point out the complete code of the component as follows
class UserLeft extends React.Component {
constructor(props) {
super(props)
this.state={
rangePickerValue: getTimeDistance("year")
}
}
isActive(type) {
const { rangePickerValue } = this.state;
const value = getTimeDistance(type);
if (!rangePickerValue[0] || !rangePickerValue[1]) {
return;
}
if (
rangePickerValue[0].isSame(value[0], "day") &&
rangePickerValue[1].isSame(value[1], "day")
) {
return "currentColor";
}
}
selectDate = type => {
this.setState({
rangePickerValue: getTimeDistance(type),
});
}
handleRangePickerChange = rangePickerValue => {
this.setState({
rangePickerValue,
});
}
render() {
const salesExtra = (
<div className="salesExtraWrap">
<div className="salesExtra">
<a className={this.isActive("today")} onClick={() => this.selectDate("today")}>
</a>
<a className={this.isActive("week")} onClick={() => this.selectDate("week")}>
</a>
<a className={this.isActive("month")} onClick={() => this.selectDate("month")}>
</a>
<a className={this.isActive("year")} onClick={() => this.selectDate("year")}>
</a>
</div>
<RangePicker
value={this.state.rangePickerValue}
onChange={this.handleRangePickerChange}
style={{ width: 256 }}
/>
</div>
);
return (
<div>
<Tabs tabBarExtraContent={salesExtra} size="large" tabBarStyle={{ marginBottom: 24 }}>
<TabPane tab="" key="sales">
<div className="">
<div id="visitValue"></div>
</div>
</TabPane>
<TabPane tab="" key="views">
<div className="">
<div id="visitPeople"></div>
</div>
</TabPane>
</Tabs>
</div>
)
}
}