Components

In hop, components are defined using the <component> tag and rendered using the <render> tag.

Defining a component

The <component> tag defines a new component.

<component name="foo" params-as="items">
  <for each="items" as="item">
    <div></div>
  </for>
</component>

Attributes	Use
name="…"	Specifies the name of the component.
params-as="…"	Introduces a variable that holds the data that is passed in when the component is rendered.

Rendering a component

The <render> tag renders a component.

<render component="foo" params="items" />

Attributes	Use
component="…"	Specifies the name of the component that should be rendered.
params="…"	Specifies which variable to use as the data passed to the component.