首页 > 解决方案 > react-admin 列表只显示一行

问题描述

我刚刚开始使用react-admin

以下是 App.js 文件

// App.js
import React from 'react';
import { Admin, Resource } from 'react-admin';
import jsonServerProvider from 'ra-data-json-server';

import { UserList } from './users';

const dataProvider = jsonServerProvider('http://localhost:3000/');

const App = () => (
    <Admin
        title={"Sample App"}
        dataProvider={dataProvider}
    >
        <Resource name="users" list={UserList} />
    </Admin>
);

export default App;

用户列表.js

// UserList.js
import React from 'react';
import { List, Datagrid, TextField, NumberField } from 'react-admin';

export const UserList = (props) => (
    <List
        {...props}
        sort={{ field: 'id', order: 'DESC' }}
        perPage={25}
    >
        <Datagrid>
            <TextField source="name" />
            <NumberField source="age" />
        </Datagrid>
    </List>
);

虽然页面大小设置为 25,但每页仅显示 1 条记录。我看到所有 25 条记录都从每个页面的 API 中获取。

样本

如果我缺少任何东西,请帮助我。

标签: javascriptreactjsreact-admin

解决方案


确保您的 API 返回的 ID 字段名称为“id”。


推荐阅读