JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title></title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="" />
<link
rel="stylesheet"
media="screen"
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.css"
/>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.js"></script>
</head>
<body>
<div id="dealerstock" data-frameid="" data-pca-key=""></div>
</body>
</html>
JavaScript
const data = [
{
xx: null,
a: null,
ax: null,
b: null,
e: null,
f: null,
g: null,
k: null,
l: null,
m: null,
n: null,
o: null,
q: null,
t: null,
lst: null,
lby: null,
},
{
xx: null,
a: null,
ax: null,
b: null,
e: null,
f: null,
g: null,
k: null,
l: null,
m: null,
n: null,
o: null,
q: null,
t: null,
lst: null,
lby: null,
},
{
xx: null,
a: null,
ax: null,
b: null,
e: null,
f: null,
g: null,
k: null,
l: null,
m: null,
n: null,
o: null,
q: null,
t: null,
lst: null,
lby: null,
},
{
xx: null,
a: null,
ax: null,
b: null,
e: null,
f: null,
g: null,
k: null,
l: null,
m: null,
n: null,
o: null,
q: null,
t: null,
lst: null,
lby: null,
},
{
xx: null,
a: null,
ax: null,
b: null,
e: null,
f: null,
g: null,
k: null,
l: null,
m: null,
n: null,
o: null,
q: null,
t: null,
lst: null,
lby: null,
},
{
xx: 1,
a: 'bf33e1e3-0dcd-4c20-8cea-423a2550b134',
ax: '8cea-423a2550b134',
b: '14/12/2022',
e: 'Ford',
f: 'E-Transit',
g: "350 L2H2 68kWh 184ps Leader **more text here increases the height of the row exponentially and I don't know why**",
...