Question

我从firebase获取数据

componentWillMount() {
  let athleteRef = fire.database()
    .ref("athlete")
    .orderByChild("email")
    .equalTo(this.state.email)

  athleteRef
    .once("value")
    .then((snapshot) => {
      snapshot.forEach((data) => {

        let workload: number = data.val().minutes * data.val().intensity;
        let datas = data.val();

        let workouts = {
          key: data.key,
          date: datas.dateCreated,
          athleteData: data.val(),
          workload: workload,
        };
        this.setState({ workouts: [workouts].concat(this.state.workouts) });
    })
  });
}

我做了这个排序功能

sortByDate(arr) {
  if(this.state.sortedByDate === true) {
    let sorted = arr.sort((a,b) => {
      new Date(a.date).getTime() - new Date(b.date).getTime());
    }
    this.setState({
      workouts: sorted,
      sortedByDate: false,
    });
  } else {
    let sorted = arr.sort((a,b) => {
      new Date(b.date).getTime() - new Date(a.date).getTime());
    }
    this.setState({
      workouts: sorted,
      sortedByDate: true,
    });
  }
}

在排序desc之后，数组看起来像这样（通知2016年）：

Array (11)
{key: "-KyocQLyhpwVHCpKJOBv", date: "13/11/2017", athleteData: Object, workload: 1}
{key: "-KyR0ovLXga6zlHX4J40", date: "08/11/2017", athleteData: Object, workload: 30}
{key: "-KyPny-m5OjAdK0C133e", date: "08/11/2017", athleteData: Object, workload: 80}
{key: "-KvRKjbTmbvajvcijYl2", date: "02/10/2017", athleteData: Object, workload: 72}
{key: "-KvOv-2gZ1U46btx62Lg", date: "01/09/2017", athleteData: Object, workload: 120}
{key: "-KyR0rqVt34A-_TYdpH9", date: "01/01/2017", athleteData: Object, workload: 60006}
{key: "-KyR0qf78bi7S1xE7QyE", date: "01/01/2017", athleteData: Object, workload: 100000}
{key: "-KvXHVN6MsfQS-j6aAx9", date: "01/01/2017", athleteData: Object, workload: 100000}
{key: "-KyR0kW7WWE9N5SIM9hz", date: "01/01/2016", athleteData: Object, workload: 5000000000}
{key: "-KvMBqOTfcQpf1nJsY-V", date: "21/09/2017", athleteData: Object, workload: 80}
{key: "-KvMBbaNmbeg9h66YNoj", date: "01/10/2017", athleteData: Object, workload: 100}

在我运行函数的asc部分后，我得到了：

{key: "-KyocQLyhpwVHCpKJOBv", date: "13/11/2017", athleteData: Object, workload: 1}
{key: "-KyR0kW7WWE9N5SIM9hz", date: "01/01/2016", athleteData: Object, workload: 5000000000}
{key: "-KyR0rqVt34A-_TYdpH9", date: "01/01/2017", athleteData: Object, workload: 60006}
{key: "-KyR0qf78bi7S1xE7QyE", date: "01/01/2017", athleteData: Object, workload: 100000}
{key: "-KvXHVN6MsfQS-j6aAx9", date: "01/01/2017", athleteData: Object, workload: 100000}
{key: "-KvOv-2gZ1U46btx62Lg", date: "01/09/2017", athleteData: Object, workload: 120}
{key: "-KvRKjbTmbvajvcijYl2", date: "02/10/2017", athleteData: Object, workload: 72}
{key: "-KyR0ovLXga6zlHX4J40", date: "08/11/2017", athleteData: Object, workload: 30}
{key: "-KyPny-m5OjAdK0C133e", date: "08/11/2017", athleteData: Object, workload: 80}
{key: "-KvMBqOTfcQpf1nJsY-V", date: "21/09/2017", athleteData: Object, workload: 80}
{key: "-KvMBbaNmbeg9h66YNoj", date: "01/10/2017", athleteData: Object, workload: 100}

所以...是的，它几乎是正确的，但有些记录都不合适：）

我也尝试用

制作日期

moment().format("YYYY-MM-DD")

但是给出了相同的输出......有什么建议吗？谢谢！

Answer 1

不鼓励将字符串传递给Date构造函数see date MDN page for more。对它进行排序的正确方法是使用Moment并传递它的格式并将其转换为用于排序的时间戳。

为了便于阅读，我将其移至单独的函数和通用数据（确保您在案例中访问date poperty）：

const data = [//this is your data]
const dateFormat = 'DD/MM/YYYY'
const sorted = data.sort(
 (a, b) =>
 moment(a, dateFormat).unix() - moment(b, dateFormat).unix()
)

另一件事是在React中设置setState是异步的，因为它可能会被批处理或推迟到以后。基于前一个设置状态的正确方法是使用传递给setState的回调。您的示例的简化代码将是：

this.setState(state => {
  return {
    sortedByDate: !state.sortedByDate,
    sorted: // do sorting here :)
  }
})

按比较排序日期，在React中返回错误的顺序

1 个答案: