Javascript 如何根据react js表行中单击的名称动态获取服务器和数据库中的URL

在reactjs中，如何根据reactjs中表行中单击的名称获取服务器和数据库中的URL。在我下面使用react js的代码中，我尝试做的是，我有一个表ok，在点击表行名称的基础上，url被动态打开，在服务器或数据库中获取。我们如何做到这一点

现在在我的代码中，我静态地在click行表上获取url，但我希望在名称匹配的基础上动态获取url。我们怎么能做到呢

假设我在服务器中有10个不同的url，我有一个表行和一列，当我单击一行时，根据名称获取一个url

有什么帮助吗。非常感谢

var TableComponent = React.createClass({
  render: function() {
    // Data
    var dataColumns = this.props.data.columns;
    var dataRows = this.props.data.rows;

    var tableHeaders = (<thead>
          <tr>
            {dataColumns.map(function(column) {
              return <th>{column}</th>; })}
          </tr>
      </thead>);

 var tableBody = dataRows.map(function(row) {
  return (
    <tr>
      {dataColumns.map(function(column) {
        return <td><a  target="_blank" rel="noopener noreferrer" href={row.url}>{row[column]}</a></td>; })}
    </tr>); });
     
    // Decorate with Bootstrap CSS
    return (<table className="table table-bordered table-hover" width="100%">
        {tableHeaders}
        {tableBody}
      </table>) }});
        

// Example Data
var tableData = {
 columns: ['Service_Name', 'Cost/Unit', 'Unit', 'Units Requested'],
  rows: [{
    'Service_Name': 'one Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12,
    'url': 'http://commondatastorage.googleapis.com/codeskulptor-assets/lathrop/asteroid_blue.png',
  }, {
    'Service_Name': 'two Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12,
    'url': 'http://codeskulptor-assets.commondatastorage.googleapis.com/assets_clock_background.png'
  },{
    'Service_Name': 'three Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
     'Units Requested': 12,
    'url': 'http://commondatastorage.googleapis.com/codeskulptor-assets/lathrop/asteroid_blend.png'
  }, {
    'Service_Name': 'four Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12
  }, {
    'Service_Name': 'five Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12
  }, {
    'Service_Name': 'six Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12
  }, {
    'Service_Name': 'seven Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12
  }, {
    'Service_Name': 'eight Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12
  }, {
    'Service_Name': 'nine Assitance',
    'Cost/Unit': 50,
    'Unit': '1 Hour',
    'Units Requested': 12
  }, {
    'Service_Name': 'ten',
    'Unit': null,
    'Cost/Unit': undefined,
    'Units Requested': 42
  }]
};

ReactDOM.render(
  <TableComponent data = {tableData} />,
  document.getElementById('table-component'));

var TableComponent=React.createClass({
render:function（）{
//资料
var dataColumns=this.props.data.columns；
var dataRows=this.props.data.rows；
var tableHeaders=(
{dataColumns.map（函数（列）{
返回{column}；}）}
);
var tableBody=dataRows.map（函数（行）{
返回(
{dataColumns.map（函数（列）{
return；}）}
); });
//用引导CSS装饰
返回(
{tableHeaders}
{表体}
) }});
//示例数据
var表格数据={
列：[“服务名称”、“成本/单位”、“单位”、“请求的单位”]，
行：[{
“服务名称”：“一个助手”，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12，
“url”：”http://commondatastorage.googleapis.com/codeskulptor-assets/lathrop/asteroid_blue.png',
}, {
“服务名称”：“两个助手”，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12，
“url”：”http://codeskulptor-assets.commondatastorage.googleapis.com/assets_clock_background.png'
},{
‘服务名称’：‘三助’，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12，
“url”：”http://commondatastorage.googleapis.com/codeskulptor-assets/lathrop/asteroid_blend.png'
}, {
‘服务名称’：‘四个助手’，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12
}, {
“服务名称”：“五个助手”，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12
}, {
“服务名称”：“六个助手”，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12
}, {
‘服务名称’：‘七个助手’，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12
}, {
‘服务名称’：‘八个助手’，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12
}, {
“服务名称”：“九个助手”，
“成本/单位”：50，
‘单位’：‘1小时’，
“请求的单位”：12
}, {
“服务名称”：“十”，
“单位”：空，
“成本/单位”：未定义，
“请求的单位”：42
}]
};
ReactDOM.render(
,
document.getElementById（'table-component'）；

plz有人能帮我吗？到目前为止你尝试了什么？@trixn我怀疑我在服务器上有10个不同的url。当我点击一个按钮，然后获取我需要的url时，我在页面上有四个按钮。像这样，我在页面上有4个按钮，红色，绿色，蓝色，当我点击红色按钮时，黑色按钮，然后在服务器中获取一个红色url，我需要获取url。我们如何使用api中的react或类似数据库来实现这一点？我理解这个问题。我在问你的解决方案。到目前为止你尝试了什么？