是否有任何单元格编辑功能或一些库，以便我可以为表中的每个用户生成唯一的ID？我正在考虑使用反应键索引库。

您可以在这里查看我的用户表：http://campers-leaderboard-cmtran7393.c9users.io:8080/

非常感谢。

import React, { Component } from 'react';
import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table';
import fetch from 'isomorphic-fetch';

const API = 'https://fcctop100.herokuapp.com/api/fccusers/top/recent';


function imageFormatter(cell, row){
  return "<img style='height:100px; width: 150px' src='"+cell+"'/>" ;
}

function userLinkFormatter(cell,row){
  return   `<a href="https://www.freecodecamp.org/${cell}" target='_blank'>` + cell + `</a>`;
}

class App extends Component {
  constructor(props){
    super(props);
    this.state = {campers: []};


  }
  componentDidMount() {
    fetch(API)
      .then(response => response.json())
      .catch(error => console.error('Error:', error))
      .then(data => {this.setState({ campers: data })}
      )


  }


  render() {
    if(!this.state.campers){return <p>Loading...</p>}
    return (
     <div className="container-fluid">
        <h1 className="text-center">FreeCodeCamp Leaderboard</h1>
       <BootstrapTable data={this.state.campers} striped={true} hover={true} >
        <TableHeaderColumn dataField='id' isKey={true}>#</TableHeaderColumn>
        <TableHeaderColumn dataField='img' dataAlign='center' dataFormat={imageFormatter}>Avatar</TableHeaderColumn>
        <TableHeaderColumn dataField='username' dataAlign='center' dataFormat={userLinkFormatter}>Camper Name</TableHeaderColumn>
        <TableHeaderColumn dataField='recent' dataAlign='center' dataSort={true}>Points in the past 30 days</TableHeaderColumn>
        <TableHeaderColumn dataField='alltime' dataAlign='center' dataSort={true}>All time points</TableHeaderColumn>

      </BootstrapTable>

      </div>
      );
  }
}

export default App;