marmelab/react-admin · error

<ShowBase> requires either a `render` prop or `children` pro

Error message

<ShowBase> requires either a `render` prop or `children` prop

What it means

ShowBase is the headless show (record detail) controller. Like ListBase, it requires a `render` prop or `children` to produce output; the error is thrown at render when both are missing so nothing could be displayed.

Source

Thrown at packages/ra-core/src/controller/show/ShowBase.tsx:65

    error,
    redirectOnError,
    children,
    render,
    ...props
}: ShowBaseProps<RecordType>) => {
    const hasError = error !== false && error !== undefined;
    const controllerProps = useShowController<RecordType>({
        ...props,
        redirectOnError: redirectOnError ?? (hasError ? false : undefined),
    });

    const isAuthPending = useIsAuthPending({
        resource: controllerProps.resource,
        action: 'show',
    });

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

    const { isPaused, isPending, error: errorState } = controllerProps;

    const showAuthLoading =
        isAuthPending &&
        !props.disableAuthentication &&
        authLoading !== false &&
        authLoading !== undefined;

    const showLoading =
        !isPaused &&
        ((!props.disableAuthentication && isAuthPending) || isPending) &&
        loading !== false &&
        loading !== undefined;

View on GitHub (pinned to 051f511bb0)

Solutions

  1. Pass render: <ShowBase resource="posts" id={id} render={(props) => <ShowView {...props} />} />
  2. Or pass children: <ShowBase resource="posts" id={id}><ShowView /></ShowBase>
  3. Ensure conditional children are truthy whenever ShowBase renders

Example fix

// before
<ShowBase resource="posts" id={id} />
// after
<ShowBase resource="posts" id={id} render={({ record }) => record ? <PostShow record={record} /> : null} />
Defensive patterns

Strategy: validation

Validate before calling

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

Prevention

When it happens

Trigger: Rendering <ShowBase resource="posts" id={id} /> with neither render nor children; children resolving to null/undefined/false conditionally; removing the render body during a refactor while keeping ShowBase mounted.

Common situations: Custom show pages built on headless components where the view component is conditionally included; migration from <Show> to ShowBase; typos in props; wrapping ShowBase in abstractions that forget to forward children.

Related errors


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