reactjs - react : How to filter events according to date

Question

我在 js 文件中的表格中显示事件，如下所示:

 // index.component.js

import React, { Component } from 'react';
import axios from 'axios';
import TableRow from './TableRow';
import moment from 'moment';
export default class Index extends Component {

constructor(props) {
  super(props);
  this.state = {event: []};
}
componentDidMount(){
  axios.get('http://localhost:4000/event')
    .then(response => {
      this.setState({ event: response.data });

    })
    .catch(function (error) {
      console.log(error);
    })
}


tabRow(){
  var events = this.state.event
  events.sort((a,b) => {return new Date(a.startDate) - new 
Date(b.startDate)} ) ;
  return events.map(function(object, i){
  return <TableRow obj={object} key={i} />;
});
}


render() {
  return (
    <div>
      <table className="table table-striped" style={{ marginTop: 20 , width:700}}>
        <tbody>
          { this.tabRow() }
        </tbody>
      </table>
    </div>
  );
}

}

My table.js

// TableRow.js


class TableRow extends Component {
constructor(props) {
    super(props);
 }

render() {
return (

    <tr>
      <td>
        {this.props.obj.event_name} 
      </td>
      <td>{ moment(this.props.obj.startDate).format("MMMM D, Y") }</td>
      <td>
        <button onClick={this.delete} className="btn btn- 
      danger">Delete</button>
      </td>
     </tr>
     );
     }
      }
   export default TableRow;

现在，我正在使用事件的排序功能，如您在上面提供的代码中所见，根据日期对事件进行排序，最旧的事件是第一个列出的事件。那没问题。我想过滤数组，以便已经过去的事件不会出现在我的决赛 table 中。如何将其与当前日期进行比较并过滤掉旧事件？

Answer 1

您需要从您的事件日期中减去当前日期，并检查它是否小于 0。如果是，则它是过去的，您可以忽略它。所以过滤器函数应该是这样的:

const dates = ["2018-09-12", "2018-10-18", "2018-12-30"];
const filteredDates = dates.filter(d => new Date(d) - new Date() > 0);

这就是你的情况:

events = events.filter(a => new Date(a.startDate) - new Date > 0);