I need to show an html table from Strapi what is the best way to lay this out in strapi as I need it to be a scaleable component that can have multiple headers and multiple rows?
currently I have a hard coded version that works in nextjs. This is my hard coded json that i am looping through which works. i just dont know how to lay this out in strapi so its easy for non developers.
It almost needs to be a repeatable component inside a repeatable component. but this does not seem to be possible
const columnData = [
{
col: [“2021”, “15.2”, “16.8”],
colBgCol: “bg-white”,
},
{
col: [“2020”, “3.5”, “4.0”],
colBgCol: “bg-white”,
},
{
col: [“2019”, “8.3”, “9.5”],
colBgCol: “bg-white”,
},
{
col: [“2018”, “10.4”, “11.5”],
colBgCol: “bg-white”,
},
{
col: [“2017”, “9.4”, “10.3”],
colBgCol: “bg-white”,
},
{
col: [“2016”, “5.8”, “6.3”],
colBgCol: “bg-white”,
},
{
col: [“2015”, “6.3”, “7.2”],
colBgCol: “bg-white”,
},
{
col: [“2014”, “11.5”, “12.6”],
colBgCol: “bg-white”,
},
{
col: [“2013”, “14.2”, “15.6”],
colBgCol: “bg-white”,
},
{
col: [“2012”, “2.2”, “2.4”],
colBgCol: “bg-white”,
},
{
col: [“5-year compound average p.a.”, “9.3”, “10.3”],
colBgCol: “bg-red”,
},
{
col: [“10-year compound average p.a.”, “8.6”, “9.5”],
colBgCol: “bg-red”,
},
];