如何解决列表中的 React-admin 排序无法按预期工作
在我的 react-admin 项目中,我有一个简单的列表。不幸的是,当我单击列标题时,排序不起作用。出现箭头动画并且 URL 得到更新,但排序不会应用于列表。为什么会发生这种情况?
List.tsx
export const List = (props) => {
return (
<List {...props} bulkActionButtons={false}>
<Datagrid rowStyle={postRowStyle}>
<TextField source="number" sortBy="number" />
<TextField source="salutation" label="Salutation" sortBy="salutation" />
<TextField source="firstname" label="Firstname" sortBy="firstname" />
<TextField source="lastname" label="Lastname" sortBy="lastname" />
<EmailField source="email" label="Email" sortBy="email" />
<FunctionField render={record => `${record.street} ${record.housenumber}`} label="Street" sortBy="street"/>
</Datagrid>
</List>
);
}
CustomDataProvider.ts
const CustomDataProvider = (apiUrl,httpClient = fetchUtils.fetchJson): DataProvider => ({
getList: (resource,params) => {
const {page,perPage} = params.pagination;
const {field,order} = params.sort;
const query = {
...fetchUtils.flattenObject(params.filter),sort: JSON.stringify([field,order]),_start: (page - 1) * perPage,_end: page * perPage,};
const url = `${apiUrl}/${resource}?${stringify(query)}`;
return httpClient(url).then(({headers,json}) => {
if (!headers.has('x-total-count')) {
throw new Error(
'...'
);
}
return {
data: json.map(function (data) {
return {...data,id: data.nummer}
}),total: parseInt(
headers.get('x-total-count').split('/').pop(),10
),};
});
},
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。