opaque oxide
I have this piece of code:
<ArrayField
path={path}
field={{
type: "array",
name: path,
// Make this dynamic
label: "dynamic",
fields: props.field.fields[0].fields,
}}
readOnly={true}
permissions={true}
/>
Is it possible to make the label dynamic based on an array item?
I use this code to fill each row:
const { value, setValue } = useField<variants>({ path, validate: () => true });
limpid latchBOT
crimson badge
Hey @opaque oxide,
For sure - you're looking for the RowLabel custom component: https://payloadcms.com/docs/fields/array#row-label
opaque oxide
Yes, I tried using that, but since I'm using a custom component, it's not overwriting it.:(
type: "array",
name: "variants",
admin: {
readOnly: true,
components: {
Field: "@/lib/payload/collections/products/ui/VariantOptions",
// Not working since I use a custom component
RowLabel: ''
},
}
Internally the array field use the ArrayRow component to render out the RowLabel: https://github.com/payloadcms/payload/blob/main/packages/ui/src/fields/Array/ArrayRow.tsx#L136-L141
I guess this would entirely depend on how you render the array
opaque oxide
Ah yes strange.. It does work when I click save. I guess I leave it like this for now..
Thanks for the help!!
limpid latchBOT