dynamic
Description
Optional. Enables dynamic data loadingUsage
dynamic?: { rowsCount: number };
Parameters
rowsCount
- the number of all rows in the dataset
Example
In the example below we use the dynamic
property to enable dynamic data loading and specify the number of all rows in a dataset. The data-request
action is triggered while scrolling and we add the event handler that receives the row.start and row.end values and loads data.
import { Grid } from "wx-react-grid";
import { getData } from "./common/data";
import { useRef } from "react";
const { allData, columns } = getData();
export default function App() {
let data = [];
const api = useRef(null);
function dataProvider(ev) {
const { requestData } = ev.detail;
const { row } = requestData;
if (row) data = allData.slice(row.start, row.end);
}
let rowsCount = 500;
return (
<Grid
data={allData}
columns={columns}
dynamic={{ rowsCount }}
onDataRequest={dataProvider}
api={api}
/>
);
}
Related articles: