ui:attributes

Renders the attributes a caller passes to your component that are not declared as props.

Forward attributes to an element

A caller adds attributes like on any other element:

<ui:addToBasket data-product-id="42" disabled />

Place {ui:attributes()} on the element inside the component that should carry them:

<button {ui:attributes()}>Add to basket</button>

This renders:

<button data-product-id="42" disabled>Add to basket</button>

A template that uses {class} takes class as a prop and keeps it out of the attributes. Render it yourself there, for example with ui:cn.

Keep what the element sets itself

A caller's attribute never replaces one the same element writes. This element sets type:

<button type="button" {ui:attributes()}>Add to basket</button>

A caller passes type and data-product-id:

<ui:addToBasket type="submit" data-product-id="42" />

This renders:

<button type="button" data-product-id="42">Add to basket</button>

An attribute the element renders under a condition, like {f:if(condition: closed, then: 'hidden')}, counts as well, so a caller's hidden stays out while the condition is false. List attributes the template adds some other way, for example from a variable, in skip. Use only to render a few attributes and leave out the rest.

Forward attributes to another component

A component that uses ui:attributes gets an attributes prop that takes an array. Pass the attributes on through it with asArray:

<ui:input attributes="{ui:attributes(asArray: true)}" />

Arguments

Name	Type	Description	Required	Default
`skip`	string	A comma-separated list of attributes to leave out, on top of the ones the element sets itself	No	-
`only`	string	A comma-separated list of attributes to render. All other attributes are left out	No	-
`asArray`	boolean	If true, the attributes will be rendered as an array instead of a string. Useful when you need to pass the attributes to a Tag-ViewHelper with the `additionalAttributes` argument	No	false