Question

我是react-redux.的新手。在这里，我有一个类似的回复，

{
        "content": [{
            "id": "5b7d4a566c5fd005075051"
            "createdAt": 12345677,,
            "Name": "abc"
        },
        {
            "id": "5b7d4a566c5fd005075051"
            "createdAt": 12235677,
        },
        {
            "id": "5b7d4a566c5f0507501051"
            "createdAt": 123675677,
        }]
    }

现在，利用这些数据，我将创建一个看起来像这样的表

{this.props.data && this.props.data.content && this.props.data.content.length > 0 && this.props.data.content.map((item, key) => {
              return (
                <tr key={key}>
                  <td className="font-weight-bold wc-30">{key + 1}</td>
                  <td>{item.Name}</td>
                </tr>
              )
            })}

现在，我确实拥有createdAt这个timeStamp。因此，我想在ascending order中呈现此表。就像，最晚创建的那样，将放在第一位。

所以，我尝试了一个

const sortedList = this.props.data.sort((a, b) => b.createdDate - a.createdDate);

但是，我没到那儿。所以，有人可以帮我吗？

Answer 1

您的列表没有定义任何createdDate。尝试按createdAt排序。

像这样：

let json = [{
    id: "5b7d4a566c5fd005075051",
    createdAt: 12345677,
    Name: "abc"
  },
  {
    id: "5b7d4a566c5fd005075051",
    createdAt: 12235677,
  },
  {
    id: "5b7d4a566c5f0507501051",
    createdAt: 123675677,
  }
]


const output = json.sort((a, b) => {
  return b.createdAt - a.createdAt
})
console.log(output)

Answer 2

json.sort((a, b) => { return a.createdAt - b.createdAt })

a-b不是b-a。

Answer 3

这是使用sort（）函数的完整代码

import React from "react";

var x = {
        "content": [{
            "id": "5b7d4a566c5fd005075051",
            "createdAt": 12345677,
            "Name": "abc"
        },
        {
            "id": "5b7d4a566c5fd005075051",
            "createdAt": 12235677,
            "Name": "d"
        },
        {
            "id": "5b7d4a566c5f0507501051",
            "createdAt": 123675677,
            "Name": "e"
        }]
    };
var y = x.content.sort((a,b)=>{
    return a.createdAt-b.createdAt
})

class Main extends React.Component {

render(){
    return(
        <table>
        <tbody>
                {y.map((item, key) => {
              return (
                <tr key={key}>
                  <td className="font-weight-bold wc-30">{key + 1}</td>
                  <td>{item.Name}</td>
                </tr>
              )
            })}

        </tbody>
        </table>
    )
}
}


export default Main;

如何使用React中的对象数组中的时间戳进行迭代

3 个答案: