CODEWITHSUNDEEP
reactjsadmin-on-rest
Clément Le Biez
Clément Le Biez

Reputation: 25

Admin on rest - How to display a Datagrid withtout a ReferenceField?

In one of my API endpoint I have a resource like that :

{
    "name": "Foo",
    "anotherField": "anotherValue"
    "users": [
        {
          "id": "XXX-XXX-XXX-XXX"
          "firstname": "Clément",
          "lastname": "Le Biez"
        }
    ]
}

And I would like to display it in the Show view with a Datagrid component :

      <Show {...props}>
        <SimpleShowLayout>
            <TextField source="id" />
            <TextField source="name" />
            <TextField source="anotherField" />
            {# Here use data grid for display users #}
            <Datagrid>

            </Datagrid>
        </SimpleShowLayout>
    </Show>

I don't care about ReferenceField of anything like that because I already have users resources in the main entity. What's the tips for use Datagrid without List or Reference Component?

Upvotes: 2

Views: 451

Answers (1)

kunal pareek
kunal pareek

Reputation: 1283

Datagrid is just an iterator component. It iterates through the a list of 'resource' provided by its parent.

A look at the source code for Datagrid shows that it accepts the following properties from its parent

resource, children, ids, isLoading, data, currentSort, basePath

1) here the resource is an array of values to be displayed

2) children are the various columns you want to display

3) ids are the ids of the resources above ^^

4) isLoading is provided by the parent but is a boolean, try setting default values for it and see what will work

5) basePath is the path of the route. If you log the props being passed to your show component, you will probably find it. Just pass it down the chain to datagrid.

If none of this works, then know that Datagrid is just a thin layer on top of the MUI Table component. You can just use that straight and really customize it for your needs

Upvotes: 2

Related Questions