marmelab/react-admin · error

<ListBase> requires either a 'render' prop or 'children' pro

Error message

<ListBase> requires either a 'render' prop or 'children' prop

What it means

ListBase is the headless list controller component; like InfiniteListBase it requires either a `render` function prop or `children` to output something. The error is thrown during render when both are absent, because the component cannot know what to display.

Source

Thrown at packages/ra-core/src/controller/list/ListBase.tsx:65

export const ListBase = <RecordType extends RaRecord = any>({
    children,
    emptyWhileLoading,
    authLoading,
    loading,
    offline,
    error,
    empty,
    render,
    ...props
}: ListBaseProps<RecordType>) => {
    const controllerProps = useListController<RecordType>(props);
    const isAuthPending = useIsAuthPending({
        resource: controllerProps.resource,
        action: 'list',
    });

    if (!render && !children) {
        throw new Error(
            "<ListBase> requires either a 'render' prop or 'children' prop"
        );
    }

    const {
        isPaused,
        isPending,
        isPlaceholderData,
        error: errorState,
        data,
        total,
        hasPreviousPage,
        hasNextPage,
        filterValues,
    } = controllerProps;

    const showAuthLoading =
        isAuthPending &&

View on GitHub (pinned to 051f511bb0)

Solutions

1. Pass a render prop: <ListBase resource="posts" render={(props) => <ListView {...props} />} />
2. Or pass children elements: <ListBase resource="posts"><ListView /></ListBase>
3. Verify any conditional wrapping around children yields a truthy element whenever ListBase renders

Example fix

// before
<ListBase resource="posts" />
// after
<ListBase resource="posts" render={({ data }) => <DataTable data={data} />} />

if (!render && !children) {
  throw new Error('<ListBase> needs render or children');
}
<ListBase resource="posts" render={ListView} />

When it happens

Trigger: Rendering <ListBase resource="posts" /> with neither render nor children; children resolving to falsy values (null, undefined, false) at render time, e.g. children={cond && <View/>} with cond false; typos like 'renders' or childrenAsFunction usage mistakes.

Common situations: Refactoring from <List> (which has default children) down to ListBase in a custom setup; forgetting to pass the view after extracting it; conditional rendering that hides children on first render; TypeScript not catching falsy children.

Related errors

• <InfiniteListBase> requires either a 'render' prop or 'child
• <ShowBase> requires either a `render` prop or `children` pro
• <List> requires either a `render` prop or `children` prop
• useReferenceFieldController: missing reference prop. You mus
• useShowController requires an id prop or a route with an /:i

AI-assisted analysis of marmelab/react-admin@051f511bb0 (2026-08-30). Data as JSON: /api/errors/921e357807c055bf. Report an issue: GitHub.