Question

我真的不确定如何描述我要做什么。我试图创建一个反应表组件，以某种方式组织我的数据。

假设我有一个这样的对象列表：

{ id: '887SYEP',
    client: 'CS',
    side: 'S',
    price: 85.8125,
    qty: 9866000,
    id: '8a59875bdaca5f886c5e7bdc42bb753b78cbe59d' }

请参阅所附图片。如果“边”道具为“ B”，那么价格和相关数据为投标数据，如果其“ S”为报价数据。每个对象都是股票报价。但是我想以这样的方式订购它，使得表格看起来像这样，其中最高出价和报价位于顶部：

image of ideal table

即使两个独立的引用对象，此数据也位于一行中。如果相应的“客户”和“价格”的“属性”类型为“ S”，则在左侧；如果其“ B”属性（购买/出售方），则在右侧。有没有一种方法可以使用一个表来实现这一目标，或者我需要两个吗？出价和要约价格仅在相同的存货之间是相关的，并且用户可以查看每种价格的最高价格。

Answer 1

首先，您应该过滤买家和卖家

let buyers = orders.filter(obj => obj.side === "B")
let sellers = orders.filter(obj => obj.side === "S")

然后按价格排序

buyers.sort((a,b) => a.price < b.price)
sellers.sort((a,b) => a.price > b.price)

为简单起见，假设两个数组的长度相同。结合起来做：

let orders = []
for (let index in buyers) {
    let {client: BClient, qty: BQty, price: Bid} = buyers[index]
    let {client: SClient, qty: SQty, price: Offer} = sellers[index] 
    orders.push({
        BClient,
        BQty,
        Bid,
        Offer,
        SQty,
        SClient
    })
}

然后显示orders

使用react-table在同一行中排序不同的数据对象

1 个答案: