Navigation - Web Component
Browser support
Detected engine:
Chromium
Webkit
Gecko
Parameters
The Web component uses the <z-navigation> tag:
By default, all the parameters are optional or can be set in different, except for the ones marked as required
The parametrization of the component can be done with the following custom HTML params:
| Name | Type | Description | Slot |
|---|---|---|---|
menu | string[] | The options for the menu | |
routes | string[] | The links found in the navigation bar. |
The available slots for the component are:
| Name | Tags | Description |
|---|---|---|
default | span | The content of the navigation bar. |
menu
The attribute menu is an array of objects that represent the menu items. Each object has the following properties:
text: The text to be displayed for the list item.href: The URL to navigate to when the list item is clicked.items: An array of objects that represent the sub-menu items. Each object has the same properties as the parent object.
The menu it's separated in columns, make sure if you want to display different list options in the same column you use the same array.
routes
The attribute routes is an array of objects that represent the navigation links. Each object has the following properties:
text: The text to be displayed for the list item.href: The URL to navigate to when the list item is clicked.icon: The icon to be displayed for the list item.