<RecordRepresentation>
Render the current record as text, leveraging the <Resource recordRepresentation> prop.
You can also use its hook version: useGetRecordRepresentation.
<RecordRepresentation> doesn’t require any argument. It reads the current record from the parent RecordContext and the current resource from the parent ResourceContext.
The component uses the useGetRecordRepresentation hook and the same rules are therefore applied.
// in src/posts/PostBreadcrumbs.tsximport * as React from 'react';import { Link } from 'react-router-dom';import { RecordRepresentation } from 'ra-core';
export const PostBreadcrumbs = () => { return ( <nav aria-label="breadcrumb"> <ol className="breadcrumb"> <li className="breadcrumb-item"> <Link to="/">Home</Link> </li> <li className="breadcrumb-item"> <Link to="/posts">Posts</Link> </li> <li className="breadcrumb-item active" aria-current="page"> <RecordRepresentation /> </li> </ol> </nav> );}
// in src/posts/PostEdit.tsximport { EditBase, Form } from 'ra-core';import { TextInput } from './TextInput';import { PostBreadcrumbs } from './PostBreadcrumbs';
const PostEdit = () => ( <EditBase> <PostBreadcrumbs /> <div> <Form> <TextInput source="title" /> </Form> </div> </EditBase>)Here are all the props you can set on the <RecordRepresentation> component:
| Prop | Required | Type | Default | Description |
|---|---|---|---|---|
record | Optional | RaRecord | Record from the parent RecordContext | The record to display |
resource | Optional | string | Resource from the parent ResourceContext | The record’s resource |
record
Section titled “record”The record to display. Defaults to the record from the parent RecordContext.
<RecordRepresentation record={record} />resource
Section titled “resource”The record’s resource. Defaults to the resource from the parent ResourceContext.
<RecordRepresentation resource="posts" />