wiz-menu

Ui element for links navigation.

Installation

Run following command in the terminal to install the module:

wiz install wiz-menu

Link

import wizMenu from 'wiz-menu';

Add this link directly to the layout (App.vue) or block (./common/blocks/ or ./common/blocks-library/):

export default {
  components: {
    wizMenu
  }
  ...

Basic usage

Markup:

<wiz-menu :items="menuItems" ></wiz-menu>

Script:

export default {
	name: 'block1',
	data: function () {
		return {
			menuItems: [
            			{
            				name: this.$t('menu_1'),
            				link: "https://www.viseven.com/"
            			},
            			{
            				name: this.$t('menu_2'),
            				link: "https://www.viseven.com/",
            			},
            			{
            				name: this.$t('menu_3'),
            				link: "https://www.viseven.com/",
            			},
            			{
            				name: this.$t('menu_4'),
            				link: "https://www.viseven.com/",
            			}
            	]
		}
	}
}

Localization:

<i18n>
    {
        "en": {
            "menu_1": "Menu item 1",
            "menu_2": "Menu item 2",
            "menu_3": "Menu item 3",
            "menu_4": "Menu item 4",
        }
    }
</i18n>

Parameters

items (Array) - array with menu items. Each item has properties:

• name (String) - string with text (e.g.:'My awesome text') or keypath to localized text ("$t('text')")
• link (String) - string with link. Default value is 'https://viseven.com/'