在react js中进行ajax调用后，该列将消失

我调用了一个节点js-server-postgres-db，这给了我一定的结果。我需要在两张表中显示这个结果。每个表有2列。在ajax调用之后，第二个表显示两列，但第一个表只显示第一列。这是我的反应码

Jsx代码

var apiTable = React.createClass({
  getInitialState: function() {
    return {
      data: []
    };
  },
  componentDidMount: function() {
    $.ajax({
      url: 'report/api?id=' + this.props.id,
      dataType: 'json',
      method: 'GET' ,
      success: function(res) {
        this.setState({data: res.data});
      }.bind(this),
      error: function(xhr, status, err) {
        React.unmountComponentAtNode(document.getElementById('alert'));
        React.renderComponent(<span className="alert alert-danger">Error</span>, document.getElementById('alert')); 
        console.error('Search error', err.toString());
      },
      complete: function(data) {
        React.unmountComponentAtNode(document.getElementById('alert'));
      }
    });
  },
  render: function() {
    var apis = this.state.data.api || [];
    var ctsTests = this.state.data.cts || [];
    var apiRows = apis.map(function(apiName) {
      return (<tr><td className="col-md-2">{apiName.api}</td><td className="col-md-2">{apiName.pathWeight}</td></tr>);
    });
    var ctsRows = ctsTests.map(function(test) {
      return (<tr><td>{test.cts}</td><td>{test.pathWeight}</td></tr>);
    });
    return (
      <div>
        <div className="table-container">
          <table className="table table-bordered table-hover">
            <thead>
                <tr>
                    <th className="col-md-2">CTS test cases</th>
                    <th className="col-md-2">Path Weight</th>
                </tr>
                {
                  ctsTests.length === 0 ?
                    <tr><td className="info-row">No CTS test cases found</td><td>No Path Weight</td></tr>
                  : ctsRows
                }
            </thead>
          </table>
        </div>
        <br/><br/>
        <div className="table-container">
          <table className="table table-bordered table-hover">
            <thead>
                <tr>
                    <th>Public APIs affected</th><th>Path Weight</th>
                </tr>
                {
                  apis.length === 0 ?
                    <tr><td className="info-row">No affected APIs found</td><td>No Path Weight</td></tr>
                  : apiRows
                }
            </thead>
          </table> 
        </div>       
      </div>
    );
  }
});

JS代码

var apiTable = React.createClass({displayName: 'apiTable',
  getInitialState: function() {
    return {
      data: []
    };
  },
  componentDidMount: function() {
    $.ajax({
      url: 'report/api?id=' + this.props.id,
      dataType: 'json',
      method: 'GET' ,
      success: function(res) {
        this.setState({data: res.data});
      }.bind(this),
      error: function(xhr, status, err) {
        React.unmountComponentAtNode(document.getElementById('alert'));
        React.renderComponent(React.DOM.span({className: "alert alert-danger"}, "Error"), document.getElementById('alert')); 
        console.error('Search error', err.toString());
      },
      complete: function(data) {
        React.unmountComponentAtNode(document.getElementById('alert'));
      }
    });
  },
  render: function() {
    var apis = this.state.data.api || [];
    var ctsTests = this.state.data.cts || [];
    var apiRows = apis.map(function(apiName) {
      return (React.DOM.tr(null, React.DOM.td({className: "col-md-2"}, apiName.api), React.DOM.td({className: "col-md-2"}, apiName.pathWeight)));
    });
    var ctsRows = ctsTests.map(function(test) {
      return (React.DOM.tr(null, React.DOM.td(null, test.cts), React.DOM.td(null, test.pathWeight)));
    });
    return (
      React.DOM.div(null, 
        React.DOM.div({className: "table-container"}, 
          React.DOM.table({className: "table table-bordered table-hover"}, 
            React.DOM.thead(null, 
                React.DOM.tr(null, 
                    React.DOM.th({className: "col-md-2"}, "CTS test cases"), 
                    React.DOM.th({className: "col-md-2"}, "Path Weight")
                ), 
                  ctsTests.length === 0 ?
                    React.DOM.tr(null, React.DOM.td({className: "info-row"}, "No CTS test cases found"), React.DOM.td(null, "No Path Weight"))
                  : ctsRows
            )
          )
        ), 
        React.DOM.br(null), React.DOM.br(null), 
        React.DOM.div({className: "table-container"}, 
          React.DOM.table({className: "table table-bordered table-hover"}, 
            React.DOM.thead(null, 
                React.DOM.tr(null, 
                    React.DOM.th(null, "Public APIs affected"), React.DOM.th(null, "Path Weight")
                ), 
                  apis.length === 0 ?
                    React.DOM.tr(null, React.DOM.td({className: "info-row"}, "No affected APIs found"), React.DOM.td(null, "No Path Weight"))
                  : apiRows
            )
          )
        )
      )
    );
  }
});

如有任何帮助，我们将不胜感激