Populating Material-UI DataGrid from MongoDB failing for unique ID not found

I was having a hard time with this too, turns out you can make virtual ids

https://mongoosejs.com/docs/tutorials/virtuals.html


I just put the option { virtuals: true } in my schema:

const opts = { toJSON: { virtuals: true } };

const schema = new mongoose.Schema({
    lastName: String,
    firstName: String,
    nickname: String,
}, opts);

So when i try to query, the field "id" is added. Something like:

[
    {
        "_id": "602fc7aba323ec87f00f9c76",
        "lastName": "Targaryen",
        "firstName": "Daenerys",
        "nickname": "",
        "__v": 0,
        **"id": "602fc7aba323ec87f00f9c76"**
    }
]

You can now use the getRowId property that accepts a function to specify which property on each row should be considered the id.

In the OP's case, you could do: getRowId={(row) => row._id}

Reference: https://github.com/mui-org/material-ui-x/pull/972


I actually had the same problem on my DataGrid component and I solved it with math.random() as an id >> <DataGrid id={Math.random()} />