javascript - 如何在一个单元格中添加多个对象？

Question

希望你过得很好！。

我必须使用 gridjs 在同一个单元格中插入多条记录。有人可以帮我吗？

假设这是我的 api 的示例响应

{"results": [{"Program": "Sample Program", "Show": "Sample Show Hello", "Edition": 
"Edition Name", "Venue": "Venue Name", "Start_Time": "Start Time", "End_Time": "End 
Time", "Partner": "Partner", "Artist": ["Artist 1", "Artist 2"]}]} 

如您所见，我有多个艺术家。现在这是我的网格代码

var x = new gridjs.Grid({
  columns: ["Program","Show","Edition", "Venue", "Start Time","End Time","Partner","Artist"],
  pagination: {
    limit: 4
  },
  search: true,
  sort: true,
  server:{
    url: 'http://127.0.0.1:8003/1/',
    then: data => data.results.map(show => 
      [show.Program, show.Show, show.Edition,show.Venue,show.Start_Time,show.End_Time,show.Partner,show.Artist]
    )
  },
}).render(document.getElementById("wrapper"));

并且网格在同一列中显示艺术家 1 和艺术家 2。请参阅参考图像。

在我的单元格中，我需要像 Artist 1
Artist 2这样的输出

我真的很感激任何线索！

Answer 1

.toString()在末尾添加a show.Artist，它会将数组转换为逗号分隔的字符串。这样做.toString().replace(',' '\n')，它会将它们分成不同的行。

我顺便维护gridjs-vue一下。

Answer 2

我是这样搞定的——

colums:[
....
{
name : "Artist",
formatter: (cell) =>{
    return gridjs.html(cell)
},},....]

---- 
server :{
url : '#url....'
then: data => data.result.map(show => [...,
show.Artist.toString().replace(',','<br />') ..]
}