1

我正在尝试配置一个制表器表以显示来自此 JSON url 的数据： https ://records.nhl.com/site/api/franchise-skater-records?cayenneExp=franchiseId=33

我的代码在下面，我试图让它在 JSON 文件中显示所有玩家的名字和助攻，非常感谢任何帮助！谢谢

HTML

<link href="https://unpkg.com/tabulator- 
tables@4.0.5/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-        
tables@4.0.5/dist/js/tabulator.min.js"></script>

<div id="example-table"></div>

JS

//Build Tabulator
var table = new Tabulator("#example-table", { 
ajaxURL: ("https://records.nhl.com/site/api/franchise-skater-records?cayenneExp=franchiseId=29"),  
height:"100px",
layout:"fitColumns",
placeholder:"Placeholder Data",
index: "id",
columns:[
   {title:"Name", field:"firstName", sorter:"string"},
   {title:"Assists", field:"assists", sorter:"number"},

  ],
});
4

1 回答 1

1

您遇到问题是因为您的数据在对象的 data 属性中作为数组返回，而不是简单地作为数组返回。

要处理该格式的数据，您需要使用ajaxResponse回调来告诉 Tabulator 在哪里查找数据数组。所以你的构造函数应该是这样的：

var table = new Tabulator("#example-table", { 
   ajaxURL: "https://records.nhl.com/site/api/franchise-skater-records?cayenneExp=franchiseId=29",  
   height:100,
   layout:"fitColumns",
   placeholder:"Placeholder Data",
   index: "id",
   columns:[
      {title:"Name", field:"firstName", sorter:"string"},
      {title:"Assists", field:"assists", sorter:"number"},
   ],
   ajaxResponse:function(url, params, response){
      //url - the URL of the request
      //params - the parameters passed with the request
      //response - the JSON object returned in the body of the response.

      return response.data; //pass the data array into Tabulator
   },
});
于 2018-10-24T17:41:25.717 回答