Nova · Layouts

Path

A string that starts with $. is a path into the data. It is replaced by what stands there; a value further in is reached by a longer path.

The action, as it is written

{
  id: 'path',
  data: { member: { name: 'Ada', city: 'London' } },
  layout: {
    component: 'Stack',
    children: [
      { component: 'Text', children: '$.member.name' },
      { component: 'Text', children: '$.member.city' },
    ],
  },
}

Running herepress it

Ada

London

What is done to it

Nothing. It is only drawn.

What it then holds

{ member: { name: 'Ada', city: 'London' } }

What it then says

Ada
London

Output matches the expected value

Left: the action as the package ships it. Right: the same action running in this page, rendered with this site’s components. Below: the action run as the example specifies, on the installed package.