Détail du package

@zeedhi/zd-slide-group-vue

zeedhi111.0.2

Powered by Zeedhi

readme

Componente Slide Group para Zeedhi

O componente zd-slide-group representa uma apresentação de slides para percorrer os elementos como um slide-group.

ZdSlideGroup Example

Instalação

O ZdSlideGroup é composto pelos pacotes @zeedhi/zd-slide-group-common e @zeedhi/zd-slide-group-vue. Utilize o comando abaixo para instalar ambos automaticamente:

npm install @zeedhi/zd-slide-group

Para registrá-lo, adicione o seguinte código ao inicializar a aplicação (por exemplo no arquivo zeedhi.ts)


import Vue from 'vue';
import { ZdSlideGroup } from '@zeedhi/zd-slide-group';
//import { ZdSlideGroup } from '@zeedhi/zd-slide-group-vue'; caso tenha instalado os pacotes separadamente

Vue.component('ZdSlideGroup', ZdSlideGroup);

Uso Básico

{
    "name": "BasicUsageSlideGroup",
    "component": "ZdSlideGroup",
    "multiple" : true,
    "children": [
        {
            "name":"basicUsageButton",
            "component": "ZdButton",
            "color": "gray",
            "label": "Button1"
        },
        {
            "name":"basicUsageButton2",
            "component": "ZdButton",
            "color": "gray",
            "label": "Button2"
        },
    ]
}

Propriedades

Nome Tipo Default Descrição
activeClass string v-slide-item--active Aplica active-class para os filhos quando forem ativados.
centerActive boolean false Força o item selecionado a ficar no centro.
multiple boolean false Permite selecionar multiplos itens. A propriedade value deve ser um array.
nextIcon string $next Permite modificar a seta de avançar.
prevIcon string $prev Permite modificar a seta de voltar.
showArrows boolean | string undefined Permite a visualização das setas de navegação.
tag string div Especifica uma tag comum para o elemento raíz.
value any undefined O modelo designado para o valor do componente.