Reproduce the official/demo JS Block example using ctx.openView()

I’m trying to reproduce the official/demo JS Block example using ctx.openView() to open a detail drawer.

In the demo, it works like this:

const DETAIL_UID = 'slkoh867b93';

await ctx.openView(DETAIL_UID, {
  filterByTk: row.id,
});

When clicking the card, the drawer opens correctly and shows the selected record.

In my case:

  • I already copied the UID from the detail drawer
  • I did NOT use the page UID
  • but I’m still not sure if this is actually the correct place to get the UID from

My current test:

await ctx.openView('baf244b2c11', {
  filterByTk: row.id,
});

but nothing opens.

My main questions are:

  1. Is the correct UID for ctx.openView() really the UID from the detail drawer?
  2. Is there a specific place in the builder/designer to copy the correct UID?
  3. Does filterByTk always need to use the internal NocoBase primary key?
  4. Is there any way to debug ctx.openView()?
  5. Does the drawer need any special configuration to work with openView()?

I also saw examples like:

const popupUid = `${ctx.model.uid}-detail`;

but in the demo the UID seems to be fixed/hardcoded.

Thanks!

As I understand, that UID is just the id of the dialog you open. You can enter anything there, just ensure it’s unique. Initially the popup will be opened empty, but when you add the required blocks to it using the usual GUI editor, Nocobase will keep that view configuration under this UID. So when you next time call it with the same UID, the same configuration of blocks will be applied to the opened view.