Remote Data#

This feature allows the user to implement a custom data fetching function. Using this functionality searching, filtering, sorting and paging are ignored and have to be manually implemented.

Props#

FieldTypeDescription
dataArray or funcData to be rendered

Usage#

import MaterialTable from "@material-table/core";
<MaterialTable
// ...
data={(query) =>
new Promise((resolve, reject) => {
let url = "https://reqres.in/api/users?";
url += "per_page=" + query.pageSize;
url += "&page=" + (query.page + 1);
fetch(url)
.then((response) => response.json())
.then((result) => {
resolve({
data: result.data,
page: result.page - 1,
totalCount: result.total,
});
});
})
}
/>;

Live Demo#

note

See here for more on the GLOBAL_VARS we use in our demos

Live Editor
Result
Table Title
Avatar
Id
First Name
Last Name
No records to display