Javascript react js中的职位排名表

我正在Reactjs中创建一个web应用程序，其中包含一个由firebase管理的排名表，但我遇到了一个疑问： 在根据谁使用“order by”命令下注最多对表进行排序后，我希望我能够更改位置号，例如，如果是第二个位置，它将变为第一个位置（从2变为1）。 这是我的屏幕：

这是我的密码：

import React, {useState, useEffect} from 'react'
import './Table.css'
import {firebase} from '../../firebase'


function Table() {

const [peopleShow, setPeopleShow] = useState([]);

const ref = firebase.firestore().collection("Lista");
console.log(ref);

function getData(){
  ref
  .orderBy("money", "desc")
  .onSnapshot((querySnapshot) => {
    const items = [];
    querySnapshot.forEach((doc) => {
      items.push(doc.data());
    });
    setPeopleShow(items);
  })
}

useEffect(() => {
  getData();
}, [])

return (
<section>
<div class="tbl-content">
<table cellpadding="0" cellspacing="0" border="0">
  <tbody>
  {peopleShow.map((val) => {
    return( 
    <tr key={val.ID}>
      <td>{val.ID}</td>    
      <td>{val.nationality}</td>
      <td>{val.username}</td>
      <td>{val.money}  $  <i class="far fa-caret-up"></i></td>
      <td>{val.lastbid}</td>
      <td>{val.newbid} $</td>
    </tr>
   )
   })}
   </tbody>
   </table>
   </div>
   </section>
  )}
  export default Table

import React，{useState，useffect}来自“React”
导入“./Table.css”
从“../../firebase”导入{firebase}
函数表（）{
const[peopleShow，setPeopleShow]=useState（[]）；
const ref=firebase.firestore（）集合（“Lista”）；
控制台日志（ref）；
函数getData（）{
裁判
.orderBy（“货币”、“描述”）
.onSnapshot（（querySnapshot）=>{
常量项=[]；
querySnapshot.forEach（（doc）=>{
items.push（doc.data（））；
});
设置PeopleShow（项目）；
})
}
useffect（（）=>{
getData（）；
}, [])
返回(
{peopleShow.map（（val）=>{
报税表（
{val.ID}
{val.国籍}
{val.username}
{val.money}$
{val.lastbid}
{val.newbid}$
)
})}
)}
导出默认表

---

所以我想解决这个疑问，我应该做泡沫排序吗？我声明我用数据库的id临时定义的表的位置。谢谢大家

您可以在map函数中使用索引，而不是使数字依赖于数据

{peopleShow.map（（val，index）=>{
报税表（
{index+1}
{val.国籍}
{val.username}
{val.money}$
{val.lastbid}
{val.newbid}$
)
})}

您可以在地图功能中使用索引，而不是使数字取决于数据

{peopleShow.map（（val，index）=>{
报税表（
{index+1}
{val.国籍}
{val.username}
{val.money}$
{val.lastbid}
{val.newbid}$
)
})}