Variable path in control component

[rubenvangrins]

Hi,

Im trying to create a DatGui where I can add new control components by clicking a button.

<DatGui
      data={variables}
      onUpdate={handleUpdate}
    >
      <DatButton label="Add animation" onClick={addAnimation} />
      {
        variables.map((item, i) => (
          <DatFolder key={variables.length} title={`animation: ${i + 1}`} closed>
            <DatString path={`${item}.text`} label="Text" />
          </DatFolder>
        ))
      }
</DatGui>

The array.map adds new folders to the DatGui. I want to make the path variable so I can update newly add folders. The path only seems to work when I actually calling the object key.

Is it possible to make the path variable?

Thanks.

[staff0rd]

Did you find an answer for this @rubenvangrins?

Underneath path uses lodash set, so array paths are valid - ie: path="something[0].somethingElse" or, like your example,

path={`variables[${i}].text`}