![](/img/trans.png)
[英]material-table in react does not display data in onRowAdd but but the state is changed
[英]Fix Issue with React Material-table to Display Remote Data
我有一个作为数组 object 发送的远程数据。 我将其转换为 JSON 数组,以便在材料数据表中显示此数据。 我可以调用 API 并且当我记录响应时,我可以看到转换后的 JSON 如下数据:
[{"xxxx":"xxxx","yyyy":5,"zzzz":3,"tttt":1,"qqqqq":"some-data"}]
不幸的是,我无法在表格中显示这些数据,同时也实现了分页。 请在下面找到我的代码并帮助我解决此问题:
data={query =>
new Promise((resolve, reject) => {
let formData = new FormData();
const userid = 'someID'
formData.append('userid', userid);
const config = {
headers: { 'content-type': 'multipart/form-data' },
};
let url = 'http://urlendpoint?'
url += 'per_page=' + query.pageSize
url += '&page=' + (query.page + 1)
fetch(url, {
method: 'POST',
body: formData,
config
})
.then(response => response.json())
.catch((error) => {
console.log(error.response);
})
.then(result => {
let resultData = JSON.stringify(result);
console.log('result: ' + resultData);
resolve({
data: resultData,
page: resultData.page - 1,
totalCount: resultData.total,
})
})
})
}
另外,我正在按照这个链接来实现材料表: https://material-table.com/#/docs/features/remote-data
我实际上删除了对 JSON 字符串的转换,一切正常。 请参阅下面的更新代码:
data={query =>
new Promise((resolve, reject) => {
let formData = new FormData();
const userid = 'someID'
formData.append('userid', userid);
const config = {
headers: { 'content-type': 'multipart/form-data' },
};
let url = 'http://urlendpoint?'
url += 'per_page=' + query.pageSize
url += '&page=' + (query.page + 1)
fetch(url, {
method: 'POST',
body: formData,
config
})
.then(response => response.json())
.catch((error) => {
console.log(error.response);
})
.then(result => {
resolve({
data: result,
page: result.page - 1,
totalCount: result.total,
})
})
})
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.